vue3 最佳实战-el-cascader 单选节点懒加载数据，点击文字无法选中节点

1.组件的使用

   <el-cascader 
    :teleported="false"
    v-model="deptIds" 
    :props="propsData"
    clearable
    style="width: 100%;"
    :disabled
    filterable
    popper-class="cascader-class" 
    />

2.数据懒加载

const propsData = {
    label: 'name',
    value:'id',
    lazy: true,
    checkStrictly: true,
    async lazyLoad(node, resolve) {
        const {data } = node
        const result = await getList({areaId:data.id})
        const nodes = result.data
        resolve(nodes)
    }
}

3.解决文字无法选中的问题

- el-cascader 添加 popper-class
- 设置全局样式（APP.vue中）
.cascader-class {
  .el-cascader-menu .el-radio {
    display: table;
    vertical-align: middle;
    width: 85%;
    height: 100%;
    position: absolute;
    box-sizing: border-box;
    margin-left: -20px;
    padding-left: 10px;
  }
  .el-cascader-menu .el-radio .el-radio__input {
    display: table-cell;
    vertical-align: middle;
  }
}