首页 > 其他 > 详细

vue $set

时间:2018-05-19 19:36:51      阅读:317      评论:0      收藏:0      [点我收藏+]

problem:
vue 项目中经常遇到一些需要改变 table 的某项数据,或者往 table 中 增删改 某些数据(诸如此类在 created 周期后改变已经初始化的 值)
操作结束后发现 页面根本就不能正常渲染

reason: 

受现代 JavaScript 的限制 (以及废弃 Object.observe),Vue 不能检测到对象属性的添加或删除。由于 Vue 会在初始化实例时对属性执行 getter/setter 转化过程,

所以属性必须在 data 对象上存在才能让 Vue 转换它,这样才能让它是响应的.。 (详情见 VUE 深入响应式原理

Demo:

// 伪 code 
 var arr = [
 {name:‘peter‘,age:18}  
]
this.data_arr = arr

this.data_arr[0].age = 100

  这段代码想 改变 数组中 peter 的 age,但是如果是在 created 周期后改变,页面可能无法正常渲染

我们可以这么干:

this.$set( this.data_arr[0],"age",20 )   , 具体操作数组和对象的方法如下:

技术分享图片

then, 数组会变化,页面会正常渲染,操作非常友好。

 以上 ~ 88 技术分享图片

 



vue $set

原文:https://www.cnblogs.com/guoyu234/p/9061302.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!