el-checkbox状态不更新问题

在项目中遇到了这样一个问题:
点击checkd不生效,但是选择form表单其他单选框的时候,el-checkd更新了
于是想到可能是vue没有监控到,用
this.$set(this.formItem, 'resourcePlace', [])
替换为
this.formItem.resourcePlace = []
嗯???可以了???什么情况???

去看了下vue的官方文档,发现了vue.$set作用如下
在这里插入图片描述
我这是瞎猫碰上死耗子了吗?

el-checkbox其他解决方法:

<el-checkbox :label="1"  :checked="checked"  @change="checked=!checked">1</el-checkbox>
<el-checkbox :label="2"  :checked="checked"  @change="checked=!checked">2</el-checkbox>
<el-checkbox :label="3"  :checked="checked"  @change="checked=!checked">3</el-checkbox>


data(){
	return{
		//再在data中加上checked
		checked:false,
	}
}

解决方法:运用 @change="$forceUpdate()"强制刷新
详情查看官方文档

迫使 Vue 实例重新渲染。注意它仅仅影响实例本身和插入插槽内容的子组件,而不是所有子组件

用下面这两个方法可以了,但是form表单的验证又失效了,选择了选项还是会报错,
用this.$set却没问题
一般来讲form检验出了问题一般就是el-form-item

prop与v-model绑定不一致
或者el-from 绑定数据
:model写成了v-model

害,太讨厌007了,什么都学不到。加油!!!!!

Logo

前往低代码交流专区

更多推荐