Appearance
下拉选择框
自定义数据模式
js
<app-select v-model="value" :type="AppSelectType.custom" :data="data"></app-select>
const data = reactive([
{ value: '1', label: '张三' },
{ value: '2', label: '李四' }
])枚举模式
js
// 其中AppSelectType为枚举值
<app-select v-model="value" :type="AppSelectType.enum" :data="AppSelectType"></app-select>网络模式
js
// 其中label为要显示的字段名,value为唯一标识字段名
<app-select v-model="value" :type="AppSelectType.network" label="value" value="key" url="/setmeal/setmealtype/getselect"></app-select>boolean模式
js
<app-select v-model="value" :type="AppSelectType.boolean" true-label="启用" false-label="禁用"></app-select>数据过滤
当提供的数据,不需要全部显示时,可通过数据过滤方法,来控制要显示的数据
js
<app-select v-model="value" :type="AppSelectType.network" :filter="filter" placeholder="请选择套餐分组" label="value" url="/setmeal/setmealtype/getselect"></app-select>
// 过滤等于代币套餐的数据
const filter = (data: Array<any>) => data.filter(x => x.value !== '代币套餐')