vue 动态循环出的多个select 不能重复选择相同的数据(转)
转自执着慕晚的流年<template><div class="program" v-for="(items,index) in parArr" :key="items.guid"><Select v-model="parItem.id"@on-change="onChangeProgram"><Option v-for=...
·
转自执着慕晚的流年
<template>
<div>
<div class="program" v-for="(parItem,index) in parArr" :key="index">
<el-select v-model="parItem.id" @change="onChangeProgram">
<el-option v-for="(subItem,idx) in programList" :key="subItem.id" :data-index='idx'
v-show="parItem.id == subItem.id || !selectIdsArr.includes(subItem.id)"
:value="subItem.id" :label="subItem.name">
{{subItem.name}}
</el-option>
</el-select>
</div>
</div>
</template>
<script>
export default {
name:'home',
data() {
return {
parArr:[{},{}],
selectIdsArr:[],
programList:[{
"id":1,
"name":"选项1"
},{
"id":2,
"name":"选项2"
},{
"id":3,
"name":"选项3"
}],
}
},
methods: {
onChangeProgram() {
this.selectIdsArr = [];
for (const item of this.parArr) {
if (item.id) {
this.selectIdsArr.push(item.id);
}
}
},
},
}
</script>
更多推荐
已为社区贡献2条内容
所有评论(0)