v-if 不生效----vue深入式响应原理

今天在写的一个行内编辑功能,想通过v-if 判断行内是否是编辑状态,来展示是input输入,还是普通显示文本,初始化默认的scope.row.ipshow1=true,点击编辑按钮,想通过@click='scope.row.ipshow1===false',来改变状态,重新渲染列表实现行内编辑,然后并不能达到预期效果.

v-if 不生效----vue深入式响应原理

v-if 不生效----vue深入式响应原理

v-if 不生效----vue深入式响应原理

通过多次百度,查到了关于深入响应式原理(附上官方文档https://cn.vuejs.org/v2/guide/reactivity.html),一句话总结:由于javascript 的显示,Vue 不能检测数组和对象的变化,了解了这个原理之后,我的代码做了如下修改,最终实现了行内编辑的效果(官方文档讲的特别清楚,大家一看就明白):

v-if 不生效----vue深入式响应原理

上一篇:Maven


下一篇:Vue之scope.row的最简单理解