DevSelect 选择器
主要功能
当前组件基于 el-select 封装,主要功能是增加了通过接口获取下拉框数据。在开发过程中,很多下拉框数据是通过接口获取的 ,虽然给el-select组件复制并不困难, 但是当这种情况比较多的时候对于开发也是一个比较麻烦的事情,所有我二次封装了一下,如果你们和后端约定的接口格式、字段比较统一的话,那么直接塞入接口就对接完成了。
接口获取
通过接口获取下拉框数据非常简单,直接将接口塞入组件中 api
属性中,并开启 use-api
属性即可,示例如下:
如果通过接口获取到的数据名称,并不是 label
value
而是需要使用其他字段,可以通过 option-label-key
和 option-value-key
进行修改。
v-model绑定对象
dev-select 组件在 el-select 基础上进行了拓展,支持自定义绑定指定数据,以及修改绑定的参数名称。当需要自定义绑定参数的时候,添加 obj-mapper
传入的值为对象, 对象中key代表v-model最终绑定结果中的key,value代表你要对应绑定option中的某一个参数。当你不需要修改绑定结果的名称时, key和value相等即可,反之需要修改key值。详细用法请看下方示例:
注意
绑定对象时 option-value-key 属性为必填项,默认值为value。需注意是否与当前option中唯一id的key值相同,如果你自定义修改了最终需要绑定的参数key值,那么以你最终绑定的参数key值为准。详细使用请看下方示例:
API
属性
DevSelect Props
—
事件
DevSelect Events
Function