el-form-item是用v-for循环出来的el-select 中的el-options用v-for循环后选中的永远是最后一个
可能的原因是因为v-for循环创建了多个el-option组件,但是它们都使用了相同的v-model绑定的变量,导致最后一个选项覆盖了之前的选项。解决方法是使用不同的v-model变量来绑定每个el-option组件,例如可以在v-for循环中使用一个数组来保存每个el-option的选中状态。示例代码如下:
<el-form-item label="Select">
<el-select v-model="selectedOptions" multiple>
<el-option v-for="(option, index) in options" :key="option.value" :value="option.value" :label="option.label" :selected="selectedOptions[index]"></el-option>
</el-select>
</el-form-item>
<script>
export default {
data() {
return {
options: [
{ value: 'option1', label: 'Option 1' },
{ value: 'option2', label: 'Option 2' },
{ value: 'option3', label: 'Option 3' },
],
selectedOptions: [false, false, false],
};
},
};
</script>
在上面的示例代码中,我们使用了一个selectedOptions数组来保存每个el-option组件的选中状态。在el-option组件中,我们使用:selected属性来绑定相应的选中状态。这样就可以确保每个el-option组件都使用了不同的选中状态,而不会相互覆盖。
原文地址: https://www.cveoy.top/t/topic/bp70 著作权归作者所有。请勿转载和采集!