Vue 数组嵌套中循环数组改变值未响应

Vue中数组的动态替换和变更存在不及时相应的问题,根据官网给的方法可以解决

vm.$set(vm.items, indexOfItem, newValue)

项目开发中碰到了,数组循环数组,遍历展示数组中数组,进行手动分页,分页完成后发现DOM结构没有及时响应,根据排查发i西安数组内的数组没有及时响应,于是用了上面的方法,可是数据依旧没有被响应,问题出在了数组外还有一层数组,导致你不能对数组中的某一个数组进行变更,你需要通过改变最外层数组从而到达改变深层数组的需求,代码如下

/ 手动分页
    logpagenation(page,item,index){
        //page 当前页数
        //item是内数组的某一条数据,后来发现没用
        //index是外层数组的下标
        let objx = this.mainData[index]
        objx.historyData = []
        this.$set(this.mainData,index,objx)
        let count;
        if (objx.auditRecordList.length - (page - 1) * this.historyPageSize < this.historyPageSize) {
            count = objx.auditRecordList.length;
        } else {
        // 如果满足一页,那么count的值 就是几页
            count =  page * this.historyPageSize;
        }
        let arrData = []
        for (let i = (page - 1) * this.historyPageSize; i < count; i++) {
            arrData.push(objx.auditRecordList[i]);
        }
        let obj = this.mainData[index]
        obj.historyData = arrData
        this.$set(this.mainData,index,obj);
    },

 

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值