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