Multiple selects that appear in the dynamic loop of vue become disabled
<template>
<div class="artcle">
<el-form
label-width="100px"
:model="testForm">
<el-form-item
v-for="(vtem, index) in "
:key="index"
label="Command Version">
<el-select
@change="comChange"
v-model="">
<el-option
v-for="item in versionList"
:key=""
:value=""
:disabled=" == || ()"
:label="">
</el-option>
</el-select>
<el-button
icon="el-icon-circle-plus-outline"
size="small"
@click="add(index)"
circle></el-button>
<el-button
icon="el-icon-remove-outline"
size="small"
@click="remove(index)"
:disabled="index === 0"
circle></el-button>
</el-form-item>
<el-form-item
label="Test input box">
<el-input
v-model=""></el-input>
</el-form-item>
</el-form>
</div>
</template>
ps:vue dynamically looped multiple selects cannot be repeatedly selected for the same data
<template>
<div class="program" v-for="(parItem,index) in parArr" :key="">
<Select v-model="" @on-change="onChangeProgram">
<Option v-for="(subItem,idx) in programList" :key="" :data-index='idx'
v-show=" == || !()"
:value="> {{}}</Option>
</Select>
</div>
</template>
<script>
export default {
data() {
return {
parArr:[],
selectIdsArr:[],
programList:[{
"id":1,
"name":"Option 1"
},{
"id":2,
"name":"Option 2"
},{
"id":3,
"name":"Option 3"
}],
}
},
methods: {
onChangeProgram() {
= [];
for (const item of ) {
if () {
();
}
}
},
},
}
</script>
Summarize
The above is the effect of multiple selects that have appeared and become disabled by the vue dynamic loop that the editor shared with you. I hope it will be helpful to everyone!