- vue深度监听表单时候,新老对象的值是相同的。
watch: {
form: {
handle (val, old) {
console.log(val) //=> {'sex':'1','userid':'1'}
console.log(old) //=> {'sex':'1','userid':'1'}
},
deep: true
}
},
其原因是vue在变异(非替换)数组或对象时,新旧值都指向同一个数组或者对象,vue不会保留变异之前的副本 vue-实例方法-数据
简单来说:因为数据同源。虽然可以监听到他的变化,但是要比较数据差异就不行了。
- 如何解决watch 值相同
computed: {
ChangeForm () {
return JSON.parse(JSON.stringify(this.form))
//监听对象返回深拷贝form 指向新的内存地址
// 如果是数组可以 return [...new Set(selectedArry)]
}
},
watch: {
ChangeForm: {
handle (val, old) {
console.log(val) //=> {'sex':'1','userid':'1'}
console.log(old) //=> {'sex':'2','userid':'2'}
},
deep: true
}
}