你不知道的vue——Cascader级联选择器点击标签选中复选框

Cascader级联选择器点击标签选中复选框

  • element-ui原功能
  • 实现效果
  • 代码

element-ui原功能

element-ui的Cascader级联选择器点击标签时是不会选中复选框的,我们想要实现点击标签时也能选中复选框这个效果,那么就要用到一些原生的方法
你不知道的vue——Cascader级联选择器点击标签选中复选框_第1张图片

实现效果

你不知道的vue——Cascader级联选择器点击标签选中复选框_第2张图片

代码

  mounted() {
    // Cascader 级联选择器: 点击文本就让它自动点击前面的input就可以触发选择。
    setInterval(function() {
      document.querySelectorAll('.el-cascader-node__label').forEach(el => {
        el.onclick = function() {
          if (this.previousElementSibling) this.previousElementSibling.click();
        };
      });
    }, 1000);
},

你可能感兴趣的:(vue,js,css,vue.js)