//a-select 组件文件
<template>
<a-select placeholder="请选择" :value="defaultValue" :disabled="disabledSelect" @change="changeSelect">
<a-select-option value="">请选择</a-select-option>
<a-select-option v-for="item in dataList" :value="item.dataCode" :key="item.dataCode">{{ item.dataName }}</a-select-option>
</a-select>
</template>
<script>
export default {
props: {
dataList: { //列表数组
type: Array,
default: []
},
value: { //显示值
type: [String, Array, Number],
default: ''
},
disabledSelect: { //是否禁用
type: Boolean,
default: false
}
},
watch: {
value (n) {
this.defaultValue = n
}
},
data () {
return {
defaultValue: this.value
}
},
methods: {
changeSelect (e) {
this.defaultValue = e
this.$emit('changeSelect', e)
}
}
}
</script>
// 调用
1. 页面引入文件路径
<componentSelect
:disabledSelect="是否禁用的值"
:dataList="列表数组"
v-decorator="['字段名称', { rules: [{ required: true, message: '限制字段规则' }] }]"
@changeSelect="事件"
></componentSelect>