在使用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"使用
解決后的效果如下圖:
超出的內容顯示省略號