element-ui Cascader 级联选择器 点击label选中_element cascader 级联选择器怎么实现点击任意层级就算选中

在官网中我们可以看到Cascader 级联选择器，选择任意一级选项时，只有选中radio时才能选中数据，点击label不能选中数据

解决方法：
方法一：定时器 不推荐 消耗性能

mounted () {
  // 点击文字的时候也自动选择radio标签 不推荐此用法
  setInterval(function () {
    document.querySelectorAll('.el-cascader-node__label').forEach(el => {
      el.onclick = function () {
        if (this.previousElementSibling) this.previousElementSibling.click()
      }
    })
  }, 1000)
}
1
2
3
4
5
6
7
8
9
10

方法二：修改样式
注意：el-cascader-panel 是直接挂载在body上的，所以需要全局设置

.el-cascader-panel .el-radio{ 
    width: 100%; 
    height: 100%;
    z-index: 10; 
    position: absolute; 
    top: 10px; 
    right: -10px; 
} 
.el-cascader-panel .el-radio__input{
   visibility: hidden;  //隐藏单选框，不隐藏就不用设置
} 
.el-cascader-panel .el-cascader-node__postfix{ 
  top: 10px; 
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14

el-cascader 多选下 单击label选中：我还没试，但我百度了一下…地址：https://blog.csdn.net/StrongerIrene/article/details/125106754

参考地址：https://www.cnblogs.com/WorldEye/p/14006517.html