前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >vue数组更新界面无变化

vue数组更新界面无变化

作者头像
老梁
发布2019-09-10 18:58:27
6070
发布2019-09-10 18:58:27
举报
文章被收录于专栏:Java工程师成长之路

1. vue数组更新界面无变化

1.1. 说明

  • 对数组进行更新或者添加,一定要注意方式,我的情况是数组套数组,双重循环,在造数据的时候,不断从尾部添加数据,所以写成了如下形式,每次下拉都会去加载一批相同的数据添加到尾部。初步一看好像没啥问题,实际上我碰到的就是有时候成功有时候数据一点没有显示
代码语言:javascript
复制
this.arrList[this.arrList.length] = {};
this.arrList[this.arrList.length-1].dataList = newArr;
this.arrList[this.arrList.length-1].header = 'A幢';

1.2. 解决

代码语言:javascript
复制
由于 JavaScript 的限制,Vue 不能检测以下数组的变动:
    当你利用索引直接设置一个数组项时,例如:vm.items[indexOfItem] = newValue
    当你修改数组的长度时,例如:vm.items.length = newLength
  • 解决方法请参考上面的链接,我这里给出我的代码的改法
代码语言:javascript
复制
this.arrList[this.arrList.length] = {};
this.$set(this.arrList,this.arrList.length-1,{dataList:newArr,header:'A幢'});

1.3. 总结

  • vue里还是有些方法不能进行数据绑定的操作的,对这些方法还是要着重看下,理解下
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2019-07-08 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1. vue数组更新界面无变化
    • 1.1. 说明
      • 1.2. 解决
        • 1.3. 总结
        领券
        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档