vue解决Element-ui中 el-cascader 级联选择器 最后一级数据为空显示暂无数据问题

1. 出现问题bug: el-cascader控件 最后一级出现空白 暂无数据

2. 解决办法: 使用递归的方式，将最底层中的 children 设为 undefined

2.1 html代码

<el-cascader
  v-model="busAreaForm.codeUp"
  placeholder="请选择"
  :options="codeUpList"
  :props="{ checkStrictly: true }"
  show-all-levels
></el-cascader>

2.2 JS处理

const getRightsTree = () => {
  api.businessArea.getRightsTree().then(res => {
    busArea.codeUpList = res.data
    rewriteKey(busArea.codeUpList)
  })
}
const rewriteKey = (val) => {
  val.forEach(item => {
    item.label = item.bizName
    item.value = item.bizCode
    item.children = item.childrenList.length !== 0 ? item.childrenList : undefined
    if (item.children) {
      rewriteKey(item.children)
    }
  })
}

3. 解决后效果

标签：el,vue,const,选择器,item,cascader,children,rewriteKey
来源： https://blog.csdn.net/weixin_43900414/article/details/120768526