vue-auto-select
v1.1.2
Published
基于vue+element-ui select组件二次封装
Downloads
75
Readme
使用
全局安装
npm i vue-auto-select
json 格式引入:
配合 form 组件一起使用
export const searchForm = [
{
label: 'XXXX',
prop: 'cabinId',
type: 'autoSelect',
span: 6,
apiUrl: ()=>get('/by/xxxx/api/activity/getAllCabin'),
placeholder: '请选择',
require: false,
multiple: false,
labelValue: {
label: 'cabinName',
value: 'id'
}
},
]
标签形式引入:
配合 form 组件一起使用
<VueAutoSelect
v-model="formData.autoSelect"
:defaultFiled="item.defaultFiled||'data'"
:api-url="item.apiUrl"
:value.sync="formData.autoSelect"
:other-config="{
size: 'medium',
labelValue:{ label: 'labelCustom', value: 'valueCustom' },//可选,默认{ label: 'label', value: 'value' }
defaultVal:{labelCustom:'全部',valueCustom:'1'},//可选,不传时没有默认值,选择全部时,传递的枚举(为了兼容组件需要默认“全部”)
placeholder:'请选择', //可选,默认false
filterable: false, //可选,默认false
disabled:false, //可选,默认false
multiple:false, //可选,默认false
style:{ width:'100%' },//可选,默认{ width:'100%' }
clearable:true,//可选,默认true
}"
/>
选项
| 参数 | 是否必传 | 参数类型 | 描述 |
| ----------- | -------- | -------- | ------------------------------------------------------------------------------ |
| defultFiled | 否 | String | 获取下拉列表数据的字段,默认data
|
| apiUrl | 是 | Function | promise 放在方法中 例:apiUrl: ()=>get('/by/xxxx/api/activity/getAllCabin'),
|
| vModel | 是 | String | 绑定值 |
| otherConfig | 否 | Object | vue-auto-select 组件的其他配置,具体参考 element- UI select 组件 |