element中el-cascader級(jí)聯(lián)選擇器只有最后一級(jí)可以多選
一、前言
element-ui中el-cascader級(jí)聯(lián)選擇器只有最后一級(jí)可以多選，其它級(jí)只有展開(kāi)子節(jié)點(diǎn)的功能，如下圖所示：
可以觀察到最后一級(jí)的li節(jié)點(diǎn)上沒(méi)有屬性aria-haspopup="true"，可以通過(guò)這個(gè)來(lái)隱藏非最后一級(jí)節(jié)點(diǎn)的el-checkbox來(lái)解決此問(wèn)題
二、實(shí)現(xiàn)
2.1、設(shè)置popper-class和multiple
設(shè)置屬性popper-class自定義浮層類名為popper-select，把props屬性中的multiple設(shè)置為true，開(kāi)啟多選
<el-cascader
:options="options"
popper-class="popper-select"
:props="{
multiple: true
}"
/>
2.2、設(shè)置樣式
選中li屬性aria-haspopup為true的標(biāo)簽，隱藏此標(biāo)簽下的el-checkbox選擇框。
注意：
style標(biāo)簽中不要加scope
.popper-select {
li[aria-haspopup="true"] {
.el-checkbox {
display: none;
}
}
}
三、最后
到此這篇關(guān)于element中el-cascader級(jí)聯(lián)選擇器只有最后一級(jí)可以多選的文章就介紹到這了,更多相關(guān)element el-cascader級(jí)聯(lián)選擇器內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
本文講解了如何在Linux環(huán)境中部署Vue項(xiàng)目,包括安裝依賴、編譯項(xiàng)目、安裝配置Nginx,并介紹了SSL證書(shū)安裝與配置,詳細(xì)說(shuō)明了使用Nginx作為靜態(tài)資源服務(wù)器和反向代理的步驟,以及進(jìn)行性能、安全性測(cè)試和備份的重要性,需要的朋友可以參考下2024-09-09
vue+elementUI實(shí)現(xiàn)表格關(guān)鍵字篩選高亮
這篇文章主要為大家詳細(xì)介紹了vue+elementUI實(shí)現(xiàn)表格關(guān)鍵字篩選高亮，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-05-05
相信tab切換對(duì)于大家來(lái)說(shuō)都不算陌生，后臺(tái)管理系統(tǒng)中多會(huì)用到。如果不知道的話，可以看一下瀏覽器上方的標(biāo)簽頁(yè)切換，大概效果就是這樣。2021-05-05
在日常開(kāi)發(fā)中,Vue 項(xiàng)目中的表單布局和樣式優(yōu)化是一個(gè)重要的環(huán)節(jié),通過(guò)合理的布局與美觀的樣式設(shè)計(jì),不僅可以提升用戶體驗(yàn),還能增加頁(yè)面的實(shí)用性和觀賞性,本文將總結(jié)幾個(gè)常見(jiàn)的表單和表格布局優(yōu)化的技巧,需要的朋友可以參考下2024-10-10
Vue-Router實(shí)現(xiàn)頁(yè)面正在加載特效方法示例
這篇文章主要給大家介紹了利用Vue-Router實(shí)現(xiàn)頁(yè)面正在加載特效方法示例，文中給出了詳細(xì)的示例代碼，相信對(duì)大家具有一定的參考價(jià)值，有需要的朋友們下面來(lái)一起看看吧。2017-02-02
詳解vue組件化開(kāi)發(fā)-vuex狀態(tài)管理庫(kù)
本篇文章主要介紹了詳解vue組件化開(kāi)發(fā)-vuex狀態(tài)管理庫(kù)，具有一定的參考價(jià)值，有興趣的可以了解一下。2017-04-04
這篇文章主要介紹了vue2.x background:url()的踩坑記錄，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
vue 動(dòng)態(tài)表單開(kāi)發(fā)方法案例詳解
這篇文章主要介紹了vue 動(dòng)態(tài)表單開(kāi)發(fā)方法,結(jié)合具體案例形式詳細(xì)分析了vue.js動(dòng)態(tài)表單相關(guān)原理、開(kāi)發(fā)步驟與實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-12-12
vue?filters和directives訪問(wèn)this的問(wèn)題詳解
這篇文章主要介紹了vue?filters和directives訪問(wèn)this的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-01-01
這篇文章主要介紹了Electron 如何調(diào)用本地模塊的方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-02-02