在vue项目中,有很多需要动态循环绑定的场景,在未知绑定数量的情况下只能动态生成绑定值
1.首先在data中定义一个对象,我在项目中时循环绑定下拉框,所以定义了一个selectVal = {}
2.在循环时通过下标在对象中创建新的值,我循环得时数组allGoodsClass是一个二维数组,此时通过下标的方式绑定,selectVal中得值就会为selectVal0 : "xxx",selectVal1 : "xxx"
<el-select v-for="(item, index) in allGoodsClass" :key="index" v-model="selectVal['selectVal'+ index]" class="goods-select" placeholder="请选择" size="mini" @change="changeGoodsClass(index)"> <el-option v-for="(item1,index1) in item" :key="index1" :label="item1.commodity_classification_name" :value="item1.id" /> </el-select>
3.在change事件触发后,通过下标即可以知道当前下拉框是循环中的哪一个,此时即可通过selectVal['selectVal' + index]取出对应的值