el-table表头全选框隐藏或禁用设置方法

 更新时间:2023年09月14日 09:54:19   作者:长相思979  
有时候我们使用el-table的选择框时,如果涉及修改、删除时,可能一次只允许用户选择一条,这样的话如果使用顶部的全选复选框就不合适了,这篇文章主要给大家介绍了关于el-table表头全选框隐藏或禁用设置的相关资料,需要的朋友可以参考下

需求:

设置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();
    },

 效果:

总结

到此这篇关于el-table表头全选框隐藏或禁用设置方法的文章就介绍到这了,更多相关el-table表头全选框隐藏内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Vue百度地图实现定位和marker拖拽监听功能

    Vue百度地图实现定位和marker拖拽监听功能

    这篇文章主要介绍了Vue百度地图实现定位和marker拖拽监听功能,实现思路非常简单,本文结合实例代码效果图给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-11-11
  • Vue自定义依赖引入的最佳实践记录

    Vue自定义依赖引入的最佳实践记录

    在现代前端开发中,自定义引入依赖是提升开发效率的关键,unplugin-auto-import插件可以帮助开发者自动引入JS模块,包括本地编写的工具方法和第三方库,通过简单的配置,开发者可以实现Vue基本库、本地文件以及第三方插件的自动引入
    2024-10-10
  • vue.js 子组件无法获取父组件store值的解决方式

    vue.js 子组件无法获取父组件store值的解决方式

    今天小编就为大家分享一篇vue.js 子组件无法获取父组件store值的解决方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-11-11
  • Vue移动端UI库之vant安装使用教程

    Vue移动端UI库之vant安装使用教程

    Vant是一个轻量、可靠的移动端组件库,目前官方只提供了Vue2、3以及微信小程序版本,并由社区团队维护React版本和支付宝小程序版本,这篇文章主要介绍了Vue移动端UI库之vant安装使用的相关资料,需要的朋友可以参考下
    2025-09-09
  • 解决vue页面刷新或者后退参数丢失的问题

    解决vue页面刷新或者后退参数丢失的问题

    下面小编就为大家分享一篇解决vue页面刷新或者后退参数丢失的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-03-03
  • Vue0.1的过滤代码如何添加到Vue2.0直接使用

    Vue0.1的过滤代码如何添加到Vue2.0直接使用

    Vue0.1的过滤代码如何添加到Vue2.0直接使用,这篇文章主要介绍了过滤代码添加到Vue2.0用的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-08-08
  • Vue使用formData格式类型上传文件的示例

    Vue使用formData格式类型上传文件的示例

    这篇文章主要介绍了Vue使用formData格式类型上传文件的示例代码,代码简单易懂,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-09-09
  • VUE3中watch监听使用实例详解

    VUE3中watch监听使用实例详解

    watch函数用来侦听特定的数据源,并在回调函数中执行副作用,下面这篇文章主要给大家介绍了关于VUE3中watch监听使用的相关资料,需要的朋友可以参考下
    2022-06-06
  • 详解vue 模拟后台数据(加载本地json文件)调试

    详解vue 模拟后台数据(加载本地json文件)调试

    本篇文章主要介绍了详解vue 模拟后台数据(加载本地json文件)调试,具有一定的参考价值,有兴趣的可以了解一下
    2017-08-08
  • vue+elementui 对话框取消 表单验证重置示例

    vue+elementui 对话框取消 表单验证重置示例

    今天小编就为大家分享一篇vue+elementui 对话框取消 表单验证重置示例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-10-10

最新评论