您的位置:首頁技術文章
文章詳情頁

Element-ui設置el-table表頭全選框隱藏或禁用

瀏覽:2日期:2022-06-12 18:51:11
目錄需求:方法1:方法2:方法3:總結需求:

設置el-table表頭的多選框隱藏或禁用,網上找的均造成即時生效,但刷新頁面時頁面會卡頓。

方法1:

直接使用css(scoped中)設置:

::v-deep .el-table__header-wrapper .el-checkbox { // display: none;//設置不成功,頁面卡頓 visibility: hidden;}方法2:

給el-table設置表頭屬性header-cell-class-name

leftheaderStyle({ row, column, rowIndex, columnIndex }) { if (columnIndex === 0) {return 'seltAllbtnDis'; } },

css部分(scoped):

::v-deep .seltAllbtnDis .cell { visibility: hidden; }

以上2種方法可隱藏全選框,效果如下:

方法3:

使用el-table的select-all方法,此方法為設置全選框禁用,非隱藏

//禁用全選框 selectAll() { this.$refs.MainTable.clearSelection(); },

效果:

總結

到此這篇關于Element-ui設置el-table表頭全選框隱藏或禁用的文章就介紹到這了,更多相關el-table表頭全選框隱藏或禁用內容請搜索好吧啦網以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持好吧啦網!

標簽: JavaScript
国产综合久久一区二区三区