Vue报错:TypeError: Cannot read properties of undefined (reading ‘fullAddress‘)

239 阅读1分钟

目录

1、报错信息:

2、错误代码:

3、错误原因:

4、改正方法:


1、报错信息:

无法读取未定义的属性

​编辑

2、错误代码:

Vue组件中的html:
<span>{{ userDefaultAddress.fullAddress }}</span>
Vue组件中的计算属性:
computed: {
    ...mapState({
      addressInfo: (state) => state.trade.address
    }),
    userDefaultAddress() {
      return this.addressInfo.find((item) => item.isDefault == 1);
    },
}

3、错误原因:

获取不到addressInfo属性

4、改正方法:

在网上搜解决方法是需要判断addressInfo是否存在,代码为:

Vue组件中的计算属性:
userDefaultAddress() {
      return this.addressInfo && this.addressInfo.find((item) => item.isDefault == 1);
}

但是尝试之后发现还是这个报错,没有解决根本问题,后来想到自己第7篇文章出现的错误和这个雷同,还是空对象的属性值是undefined的问题,解决代码如下:

userDefaultAddress() {
      return this.addressInfo.find((item) => item.isDefault == 1) || {};
},

这样改正以后,就不会出现上面的问题了。