这属于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对象快很多倍
- 用v-for 嵌套显示出来,但不适合不规则的复杂对象