element中el-cascader级联选择器只有最后一级可以多选

一、前言

element-ui中el-cascader级联选择器只有最后一级可以多选，其它级只有展开子节点的功能，如下图所示：

可以观察到最后一级的li节点上没有属性aria-haspopup="true"，可以通过这个来隐藏非最后一级节点的el-checkbox来解决此问题

二、实现

2.1、设置popper-class和multiple

设置属性popper-class自定义浮层类名为popper-select，把props属性中的multiple设置为true，开启多选

<el-cascader
             :options="options"
             popper-class="popper-select"
             :props="{
                     multiple: true
             }"
/>

2.2、设置样式

选中li属性aria-haspopup为true的标签，隐藏此标签下的el-checkbox选择框。

注意：style标签中不要加 scope

.popper-select {
        li[aria-haspopup="true"] {
                .el-checkbox {
                        display: none;
                }
        }
}

三、最后

本人每篇文章都是一字一句码出来，希望对大家有所帮助，多提提意见。顺手来个三连击，点赞收藏关注✨，一起加油☕