美文网首页
vue-单级下拉组件的设计

vue-单级下拉组件的设计

作者: 看晚霞呀 | 来源:发表于2017-09-10 22:34 被阅读0次

    下拉组件的设计有以下几个核心点:

    1. 一个页面可能存在多个下拉组件,因此数据不能保存在vuex或storage中。
    2. 传入组件的data是个[ {id: '', name: ''}, {id: '', name: ''}....]结构,id是回传给后台系统的,要支持布尔类型、字符串、数字。传入的数据要支持异步。
    3. 点击时展示下拉框、可选中(单选、多选)。多选时有选中的图标。选中时应该要触发callback函数。
    4. 支持编辑回显。
    5. 一个组件会在多处复用,防止类名样式冲突,组件内部的类名应该适当复杂化,推荐以companyName-projectName-componentName的格式,如hivebox-mall-select。不要以常见的radio、select、checked、actived等为类名。
    6. 在设计前,要考虑需要传入哪些参数props、要$emit哪些事件出来。
      <select-component :param="param">

    组件的dom结构、样式设计

    <div>
    

    相关文章

      网友评论

          本文标题:vue-单级下拉组件的设计

          本文链接:https://www.haomeiwen.com/subject/rnatsxtx.html