现在最常用网站开发工具,网站建设合理流程,wordpress去水印,网络网站网站怎么做的目的#xff1a;修改对象node的child属性的值#xff0c;页面响应式变化 问题#xff1a;数据是变了#xff0c;但是页面没反应#xff1b;在页面中用v-if绑定这个值#xff0c;数据变了#xff0c;视图也是不更新
错误写法#xff1a;
this.node.child 修改对象node的child属性的值页面响应式变化 问题数据是变了但是页面没反应在页面中用v-if绑定这个值数据变了视图也是不更新
错误写法
this.node.child 正确写法 this.$set(this.node, child, );双向绑定的修改数据机制
我们使用v-if是一个双向绑定的过程 v-if:isCommentShow[i] vue对于双向绑定的监视是通过特定的方式实现的。如果双向绑定的对象是基本类型则不影响。而如果双向绑定的变量是一个对象是一个具有多个属性的对象则需要响应式的绑定。 vue实现对对象的双向数据绑定的原理就是利用了 Object.defineProperty() 这个方法重新定义了对象获取属性值(get)和设置属性值(set)的操作来实现的。如果要给对象添加新的属性此时新属性没有进行过上述过程是不会响应的。 我们如果直接修改变量的值即this.变量 新值这种方式是没有经历重写的set方法的。双向绑定是没办法监听到我们的修改的。所以当我们修改了输出的也是新值。但是你要让双向绑定知道你修改了才行不是你改了双向绑定就立刻知道你改了。 也就是我们需要用vue的规则去改去通过对象重写的set方法去改对象的属性来达到响应式修改能够立刻通知到双向绑定的指令我修改了。 这个规则就是this.$set(this.对象属性名新值)。
总结
v-if不要绑定数组元素无效数组元素内容的变化无法响应v-if v-if绑定对象属性 {1: true, 2: false}如果提前写死v-if绑定其中一个属性则可以生效v-if 如果对象的属性数量不定是通过某方法的触发去改变对象的属性数量。需要使用$set()去更改对象的值, 如
//增改都适用
this.$set(this.对象名 属性名 新值)//不可以使用下面的方法更新
this.对象.属性 新值
//或者
this.对象[属性] 值
只要所有修改或者增加属性的语句都使用this.$set() 就能解决 v-if 无法响应对象中动态变化的属性的问题。 ———————————————— 原文链接https://blog.csdn.net/NineWaited/article/details/126258442 未整理
