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;
                }
        }
}

三、最后

到此这篇关于element中el-cascader级联选择器只有最后一级可以多选的文章就介绍到这了,更多相关element el-cascader级联选择器内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！