mb-select 选择器
# 简介
el-select二次封装,可以直接使用数据字典的数据,也可以提供url读取数据
# 使用字典
<mb-select v-model="age" type="sex" item-label="性别" />
# 静态数据
<mb-select v-model="age" :options="options" item-label="性别" />
const options = ref([
{
label: '男',
value: '1'
},
{
label: '女',
value: '0'
}
])
# 接口请求
<mb-select v-model="roles" url="/system/role/all" item-label="角色" multiple />
# select 属性
属性 | 说明 | 类型 | 可选值 | 默认值 | 示例/备注 |
---|---|---|---|---|---|
type | 字典类型 | String | 数据字典中的所有类型 | — |
|
options | 选项 | Array | — | — | :options="[{label: '吕金泽', value: 'ljz'}]" |
url | 接口相对地址,默认是get请求 | String | — | — | — |
params | 请求参数 | Object | — | — | — |
labelField | 标签字段 | String | — | label | — |
valueField | 值字段 | String | — | value | — |
width | 宽度 | String | — | 100% | — |
allOption | 是否显示”全部“项 | Boolean | — | false | — |
placeholder | 占位符 | String | — | — | — |
itemLabel | placeholder后缀 | String | — | 如果不配置placeholder属性,默认会加上前缀“请选择” | — |
multiple | 是否多选 | Boolean | — | false | 默认单选 |
join | 是否join数据用”,“隔开 | Boolean | — | true | — |
showValue | 是否显示“value”值 | Boolean | — | false | — |
上次更新: 2023-03-23 13:11:51