element table Error in callback for watcher “data“: “TypeError: Cannot read properties of null (read

本文介绍: 从提示看，应该是 element table 遍历列表数据 data 引发的。原因1：list 初始化数据是 null 导致。原因2：后台接口返回 null 未处理导致。方案2：后台接口调整，无数据时，返回 []列表页面，前后端联调接口，发现控制台报错。方案1：list 初始化改为 []

element table Er ro r in callback fo r watch e r “data”: “Ty peError: Ca nn o t read properties of null (read in g ‘reduce’)”

problem

列表页面，前后端联调接口，发现控制台报错
Error in call b ack for watch er “data”: “Ty peError: Ca nn o t read properties of null (read ing ‘reduce’)”
在这里插入图片描述

re a s on

从提示看，应该是 element table 遍历列表数据 data 引发的
原因1：list 初始化数据是 null 导致
原因2：后台接口返回 null 未处理导致

solut ion

方案1：list 初始化改为 []
方案2：后台接口调整，无数据时，返回 []

// 方案1 
data:{
    list: [], // null 改为 []
}

// 方案2  接口数据调整 
// 如果接口不能改，只能自己处理
listOrder(bodydata).then(response =&gt; {    
    // this.list = response.data.data.list // before     
    this.list = response.data.data.list || [] // after 
}