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

发布时间:2024年01月14日

一、前言

element-uiel-cascader级联选择器只有最后一级可以多选,其它级只有展开子节点的功能,如下图所示:

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

二、实现

2.1、设置popper-classmultiple

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

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

2.2、设置样式

选中li属性aria-haspopuptrue的标签,隐藏此标签下的el-checkbox选择框。

注意:style标签中不要加 scope

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

三、最后

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

文章来源:https://blog.csdn.net/u012804440/article/details/135541816
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。