方案：以最大值3为例，当已选择数据长度大于等于3，将选项中未包含已选中的选项disabled属性置为true，已选中的选项disabled置为false
// DOM
<a-select
v-decorator="[
'categoryList',
{
rules: [{ required: true, message: '请选择分类' }],
},
]"
not-found-content="暂无数据"
placeholder="请选择分类"
show-search
mode="multiple"
:allow-clear="true"
:filter-option="filterOption"
:get-popup-container="triggerNode => triggerNode.parentNode"
@change="onCategoryChange"
>
<a-select-option
v-for="item in categoryOptions"
:key="item.categoryId"
:value="item.categoryId"
:disabled="item.disabled"
>
{{ item.categoryName }}
</a-select-option>
</a-select>
// js
resetCategoryOptions() {
this.setCategoryOptions()
},
onCategoryChange (value) {
this.setCategoryOptions(value)
},
setCategoryOptions (value = []) {
if (value.length >= 3) {
this.categoryOptions.forEach((item, index, array) => {
if (value.every(v => v !== item.categoryId)) {
this.$set(array[index], 'disabled', true)
} else {
this.$set(array[index], 'disabled', false)
}
})
} else {
this.categoryOptions.forEach((item, index, array) => {
this.$set(array[index], 'disabled', false)
})
}
},
