elementUI 關於Select 選擇器 的選項內容太長,導致容器寬度撐開超過頁面寬度的問題處理


在使用elementUI Select 選擇器時,如果選項的內容長度太長的話會出現容器寬度超過頁面寬度的問題,如下圖:

 

 這時候如果只是通過 /deep/ 或 ::v-deep 樣式穿透的方式對element 的樣式重寫覆蓋的話,發現是不生效的,內聯樣式也是不生效

::v-deep .el-select-dropdown{
        max-width: 700px;
    }
 
解決方法:
 1、 elementUI  提供了popper-class屬性,來重寫Select 下拉框樣式,如果只是這樣也是不生效的,還需要

2、popper-class要搭配:popper-append-to-body="false"使用

解決后的效果如下圖:

超出的內容顯示省略號

 

 

 
 
 
 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM