vue 中 watch 监听 Object对象 变化

针对Object对象,如:

# Object 监听值
tobj:{
'a':1
}

第一种

watch: {
	tobj(new_value,old_value){
		console.log(new_value,old_value)
	}
}

上面的写法只会监听tobj是否有值的变化,如果内部,如a的值发生了变化,不会触发watch
第二种

watch: {
	tobj:{
		handler(new_value,old_value){
			console.log(new_value,old_value)
		},
		deep: true
	}
}

添加deep属性,向下添加监听到每一个key,deep默认是false
这种可以监听a的变化,但是这个不能由单一改变一个值触发watch,例如:

tobj['a']=2

就不会触发watch

如果需要改变内部值并且触发watch,需要用Vue.$set

this.$set(tobj,'a',2)

如此,便可以触发watch

Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...

avatar Vue