Vue渲染报错TypeError: Cannot read property 'length' of undefined问题咨询

• 初始状态下atributionType被赋值为undefined，计算属性isAtributionType执行时直接访问this.atributionType.length，undefined不存在length属性，直接触发类型错误
• 计算属性isAtributionType的逻辑存在根本性错误：!!this.atributionType.length返回的是布尔值，布尔值和0做大小比较永远返回false，完全无法实现「第一个下拉选中后显示第二个下拉」的需求

1. 修正isAtributionType的判断逻辑，先做非空校验再读取length属性，同时调整判断条件：

// 环境支持ES2020可选链语法的写法
isAtributionType() {
  return this.atributionType?.length > 0
}

// 兼容低版本环境的写法
isAtributionType() {
  return this.atributionType && this.atributionType.length > 0
}

2. （可选）直接把atributionType的初始值从undefined改为空数组[]，从根源避免undefined读取属性的问题：

data() {
  return {
    atributionType: [], // 修改初始值
    selectedAtributionFilter: undefined,
    selectedAtributionType: undefined,
    isOpen: false,
    atributionTypeDropDownOpen: false,
    ele: []
  }
}

• 你当前贴出的代码中第二个下拉绑定的attributionsItens没有对应定义，需要确认该变量已正确声明，避免后续触发新的undefined报错
• 现有watch中atributionType的监听逻辑和修复后的判断逻辑匹配，无需调整

内容的提问来源于stack exchange，提问作者Matheus Barem