data变化视图渲染 2018-06-05 17:51:34

受vue(或者说是js本身的特质)机制限制,vue在读取原始数据之后,后续如果通过js对该数据的字段,进行添加或者删除,那么页面视图就不会重新渲染,因此需要创建一个新对象。 

有两种方法可以解决:

第一种方法,使用Object.assign

this.item[index].isShow = false;
this.item = Object.assign({}, this.item);

使用第一种方法的缺点是(其实也不算缺点),就是每一次需要改变数据的时候,都要将Obj.assign写一次,有点麻烦。

第二种方法,使用Vue.set

this.$set(this.itemList[index], 'isShow', !this.itemList[index].isShow)

用第二种,写一行就可以了,就相当于改变原始数据(不增减字段)的this.itemList[index].isShow = !thsi.itemList[index].isShow

  1. Laravel5.7
  2. 微信相关
  3. Mysql
  4. 前端开发
  5. 随记
  6. 写作素材
  7. 开发工具
  8. 互联网