Element Cascader 级联选择器： 省市区级联可选择任一级，点击文字即选中标签

看官网！看官网！看官网！官网超有用的 --> Cascader 级联选择器

 Cascader 级联选择器 通过 props.checkStrictly = true 来设置父子节点取消选中关联，从而达到选择任意一级选项的目的。

 

  单选选择任意一级选项
  

使用props.checkStrictly = true可以选择每一级选项，但是体验感不强，需要点中小圆圈才可以选中，如果项目中使用了懒加载的话，还需要再点击文字加载下一级，这样子体验感很差，又或者客户说我就是不想点那个小圆圈就是想点文字，所以就想着能不能点击文字的同时选中小圆圈呢？请看下面这两个方法。

1. 使用CSS样式

很简单，就是使用css将小圆圈变透明然后覆盖在整个文字上方，点击文字的时候其实是在点击小圈圈。

但是 如果使用了懒加载的话，是要点击到文字才加载，但是上面又蒙了一层，点击不到文字，这个时候该怎么办？使用hover触发懒加载，使用 expand-trigger="hover" 这个属性就可以了。

 实现的效果：

2.使用JS，点击文字的时候同时选中小圈圈

 使用定时器的话，会比较耗性能的吧

mounted () {
// 点击文字的时候也自动选择radio标签 
    setInterval(function () {
      document.querySelectorAll('.el-cascader-node__label').forEach(el => {
        el.onclick = function () {
          if (this.previousElementSibling) this.previousElementSibling.click()
        }
      })
    }, 1000)
}