You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1.5 KiB
1.5 KiB
Fix.set和Fix.del是为了解决什么问题
为了知道Fix.set和Fix.del是做什么的,首先要清楚Fix有哪些场景watch不到.
熟悉Vue的同学肯定知道,Vue2.0版本中的$set
和$delete
,其实原理是类似的
state: function () {
return {
obj: {
a: 1,
},
arr: [0, 1],
};
},
watch: {
"obj.b": function () {
console.log(this.model.obj);
},
"arr.2": function () {
console.log(this.model.obj);
},
},
actions: {
changeArr: function () {
// 这两种形式都不能触发watch
this.model.obj.b = 2;
this.model.arr[2] = 2;
},
},
Fix.set
在修改对象属性后会手动触发一次通知,因此原本无法watch到变更的场景又可以了.
Fix.set(this.model.obj, "b", 2);
Fix.set(this.model.arr, 2, 2);
同样的,Fix.del
可以正常触发对删除属性的watch
watch: {
"obj.a": function () {
console.log(this.model.obj);
},
},
actions: {
changeArr: function () {
// delete this.model.obj.a;
Fix.del(this.model.obj, "a");
},
},
很多数情况下我们不借助Fix.set
和Fix.delete
也能实现功能,例如后续讲到的11、Fix中对数组、对象的操作技巧也可以解决我们的一些问题