vue中使用element-ui动态生成复选框
业务场景/遇到的问题需要动态生成多个复选框,那么v-model就需要一个array值。解决方法vue官网中深入理解响应式原理中有描述:对于已经创建的实例,Vue 不允许动态添加根级别的响应式属性。但是,可以使用Vue.set(object, propertyName, value)方法向嵌套对象添加响应式属性。例如,对于:Vue.set(vm.someObject, 'b', 2)实现代码<
·
业务场景/遇到的问题
需要动态生成多个复选框,那么v-model就需要一个array值。
解决方法
vue官网中深入理解响应式原理中有描述:
对于已经创建的实例,Vue 不允许动态添加根级别的响应式属性。但是,可以使用 Vue.set(object, propertyName, value)
方法向嵌套对象添加响应式属性。例如,对于:
Vue.set(vm.someObject, 'b', 2)
实现代码
<template>
<el-checkbox-group
v-model="checkList[index]"
v-for="(item,index) in 5"
:key="index">
<el-checkbox>
</el-checkbox>
</el-checkbox-group>
</template>
export default {
created(){
for(const index in 5){
this.$set(this.checkList,index, [])
}
},
data(){
return {
checkList: {},
}
}
}
更多推荐
已为社区贡献2条内容
所有评论(0)