以select為例,如果select寫在循環(huán)里,觸發(fā)change事件時可能不只需要傳遞被選中項的值,還要傳遞index過去,來改變同一循環(huán)中的其他標簽的狀態(tài)。
下面這樣寫是無效的:
@change="changeRewardType(val,index)"
<div v-for="(item, index) in divList">
? ? <el-select v-model="item.rewardType" class="cell_width" @change="changeRewardType(val,index)">
? ? ? <el-option
? ? ? ? v-for="itemOpt in rewardTypeList"
? ? ? ? :key="itemOpt.value"
? ? ? ? :label="itemOpt.label"
? ? ? ? :value="itemOpt.value"
? ? ? ></el-option>
? ? </el-select>
</div>
這樣再封裝一層就可以了:
@change="((val)=>{changeRewardType(val,index)})"
<div v-for="(item, index) in divList">
? ? <el-select v-model="item.rewardType" class="cell_width" @change="((val)=>{changeRewardType(val,index)})">
? ? ? <el-option
? ? ? ? v-for="itemOpt in rewardTypeList"
? ? ? ? :key="itemOpt.value"
? ? ? ? :label="itemOpt.label"
? ? ? ? :value="itemOpt.value"
? ? ? ></el-option>
? ? </el-select>
</div>