快捷導(dǎo)航

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

更新時(shí)間：2023年07月12日 11:24:50 作者：長(zhǎng)相思979

這篇文章主要給大家介紹了關(guān)于Element-ui設(shè)置el-table表頭全選框隱藏或禁用的相關(guān)資料,文中手把手教你實(shí)現(xiàn)el-table實(shí)現(xiàn)跨表格禁用選項(xiàng),需要的朋友可以參考下

需求：

設(shè)置el-table表頭的多選框隱藏或禁用，網(wǎng)上找的均造成即時(shí)生效，但刷新頁面時(shí)頁面會(huì)卡頓。

方法1：

直接使用css（scoped中）設(shè)置：

::v-deep .el-table__header-wrapper .el-checkbox {
  // display: none;//設(shè)置不成功，頁面卡頓
  visibility: hidden;
}

方法2：

給el-table設(shè)置表頭屬性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方法，此方法為設(shè)置全選框禁用，非隱藏

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

效果：

總結(jié)

到此這篇關(guān)于Element-ui設(shè)置el-table表頭全選框隱藏或禁用的文章就介紹到這了,更多相關(guān)el-table表頭全選框隱藏或禁用內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

vue iview組件表格 render函數(shù)的使用方法詳解
下面小編就為大家分享一篇vue iview組件表格 render函數(shù)的使用方法詳解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-03-03
vue-cli項(xiàng)目中怎么使用mock數(shù)據(jù)
本篇文章主要介紹了vue-cli項(xiàng)目中怎么使用mock數(shù)據(jù) ，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-09-09
解決vue路由發(fā)生了跳轉(zhuǎn)但是界面沒有任何反應(yīng)問題
這篇文章主要介紹了解決vue路由發(fā)生了跳轉(zhuǎn)但是界面沒有任何反應(yīng)問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-04-04
vue嵌套組件傳參實(shí)例分享
這篇文章主要介紹了vue嵌套組件傳參實(shí)例分享,本文以一個(gè)vue遞歸組件為例,探究多層嵌套后事件無法觸發(fā)的問題,我們可以通過查看一Demo,便于快速了解,下文列舉例子需要的小伙伴可以參考一下
2022-04-04
vue axios 封裝請(qǐng)求攔截多次彈窗的問題及解決
這篇文章主要介紹了vue axios 封裝請(qǐng)求攔截多次彈窗的問題及解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2024-08-08
vue+mock.js實(shí)現(xiàn)前后端分離
這篇文章主要為大家詳細(xì)介紹了vue+mock.js實(shí)現(xiàn)前后端分離，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2019-07-07
vue3中實(shí)現(xiàn)圖片壓縮的示例代碼
圖片壓縮是一種比較便捷的壓縮方式,本文主要介紹了vue3中實(shí)現(xiàn)圖片壓縮的示例代碼,文中通過示例代碼介紹的非常詳細(xì),需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2024-02-02
詳解Vue調(diào)用手機(jī)相機(jī)和相冊(cè)以及上傳
這篇文章主要介紹了Vue調(diào)用手機(jī)相機(jī)及上傳，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-05-05
一文了解axios和vue的整合操作
axios作為Vue生態(tài)系統(tǒng)中濃墨重彩的一筆,我學(xué)習(xí)這個(gè)東西也是花了一定的時(shí)間的,下面這篇文章主要給大家介紹了關(guān)于axios和vue整合操作的相關(guān)資料,需要的朋友可以參考下
2022-04-04
在vue中獲取dom元素內(nèi)容的方法
本篇文章主要介紹了在vue中獲取dom元素內(nèi)容的方法，可以通過給標(biāo)簽加ref屬性，這里整理了詳細(xì)的代碼,有興趣的可以了解一下
2017-07-07