vue2嵌套访问后端数据导致undefined error

这属于vue2的一个缺陷。
对于后端传过来的多层对象:如下图
在这里插入图片描述

如果在template里写前端时用

<div>{
   
   {a.b.c}}</div>

这种方式去写 会导致前端报undefined error

即这里的.b .c找不到之类的错误

网上说的解决方案:比如用v-if 还有把数据获取放到created() {} 里

对于大量用这种方式显示都太麻烦且无效

解决方案:1.把后端深层对象数据拍扁成一维度对象就可以顺利访问了

        let dataset = this.List[i].dataset
        for (let key in dataset) {
          if (dataset.hasOwnProperty(key)) { 
            this.List[i]['dataset_' + key] = dataset[key] // 拍扁
          }
        }
        this.List[i].dataset = undefined // 直接赋值undefined比delete对象快很多倍
  1. 用v-for 嵌套显示出来,但不适合不规则的复杂对象

猜你喜欢

转载自blog.csdn.net/qq_33859479/article/details/130099537
今日推荐