当前位置: 首页 > news >正文

element-plus中el-table固定列fixed失效问题

问题描述

场景:表格在子组件中,同时该子组件在父组件中引用。

表格具有合并表头的操作,同时对第一列“姓名列”进行了"fixed“固定列的操作,不起效。最初怀疑是合并表头行操作的影响,但经排查,发现是父组件中一句代码的问题。

bug效果演示

在这里插入图片描述
能看到,第一列根本没有被锁定住。

错误原因

父组件中,下面这行代码影响到了子组件中表格的fixed效果。

/* 这一句样式会让子组件中表格列的fixed属性失效,需要注意!! */
::v-deep .el-scrollbar__view {overflow-y: hidden !important;
}

此时,把这句代码注释掉,效果如下:
在这里插入图片描述
可以看到,这里已经成功被固定住了。

思路历程

我在排查这个问题的过程中,先去element-plus的官网查找了对应的issues,10096 issues, 在这个问题中,他们提到了一个demo,说是解决了这个问题,demo代码, 但在我把这个demo代码复制到我自己的项目中(就是出问题的这个组件),发现本该生效的代码并没有生效。于是我就想:“也许子组件根本没出问题,问题在父组件上”,在缩小范围后,接下来的操作就非常简单了,一步步缩小范围,最后找到了原因。

开发之路,果然奇妙。这个问题其实卡了我一个上午接近3个小时,但最后的原因却是这么简单。
希望本文能对您所有帮助,感谢阅读。

相关文章:

  • 智慧环保大数据平台建设方案
  • ASP.NET Core8.0学习笔记(十九)——EF Core DbSet
  • 论文阅读 | HiDDeN网络架构
  • 一次 Spring 扫描 @Component 注解修饰的类坑
  • 什么是数据挖掘?初学者指南
  • 基于python+django+vue的电影数据分析及可视化系统
  • 瓶子类型检测系统源码分享
  • 第十四届蓝桥杯真题Java c组A.求和(持续更新)
  • unity CustomEditor的基本使用
  • 基于php的助农生鲜销售系统
  • Transformers 引擎,vLLM 引擎,Llama.cpp 引擎,SGLang 引擎,MLX 引擎
  • 选择租用徐州服务器机柜的作用有哪些?
  • 大模型辅助需求代码开发:如何提升核心编码任务生成效果
  • C语言编译器(C语言编程软件)完全攻略(包含所有平台)
  • 【分布式微服务云原生】详细介绍下dubbo和springcloud所能支持的微服务特性,为啥能支持的技术原理,以及适用的业务场景,并对两者各方面做个详细的比较
  • 《用数据讲故事》作者Cole N. Knaflic:消除一切无效的图表
  • Angular 4.x 动态创建组件
  • CSS实用技巧干货
  • JDK9: 集成 Jshell 和 Maven 项目.
  • Mybatis初体验
  • MySQL常见的两种存储引擎:MyISAM与InnoDB的爱恨情仇
  • Vue实战(四)登录/注册页的实现
  • 对象引论
  • 入门到放弃node系列之Hello Word篇
  • 微信小程序填坑清单
  • 译有关态射的一切
  • 在electron中实现跨域请求,无需更改服务器端设置
  • 【干货分享】dos命令大全
  • ​【已解决】npm install​卡主不动的情况
  • ​2021半年盘点,不想你错过的重磅新书
  • ​水经微图Web1.5.0版即将上线
  • #1014 : Trie树
  • #每天一道面试题# 什么是MySQL的回表查询
  • $con= MySQL有关填空题_2015年计算机二级考试《MySQL》提高练习题(10)
  • ( 10 )MySQL中的外键
  • (51单片机)第五章-A/D和D/A工作原理-A/D
  • (创新)基于VMD-CNN-BiLSTM的电力负荷预测—代码+数据
  • (精确度,召回率,真阳性,假阳性)ACC、敏感性、特异性等 ROC指标
  • (五)MySQL的备份及恢复
  • (原创)攻击方式学习之(4) - 拒绝服务(DOS/DDOS/DRDOS)
  • (转)创业的注意事项
  • (转)大道至简,职场上做人做事做管理
  • .NET C# 使用GDAL读取FileGDB要素类
  • .net core 6 集成和使用 mongodb
  • .net mvc actionresult 返回字符串_.NET架构师知识普及
  • .NET 解决重复提交问题
  • .NET和.COM和.CN域名区别
  • .sdf和.msp文件读取
  • @GetMapping和@RequestMapping的区别
  • @RequestParam,@RequestBody和@PathVariable 区别
  • [2018/11/18] Java数据结构(2) 简单排序 冒泡排序 选择排序 插入排序
  • [5] CUDA线程调用与存储器架构
  • [AIGC] Spring Interceptor 拦截器详解
  • [Algorithm][动态规划][两个数组的DP][正则表达式匹配][交错字符串][两个字符串的最小ASCII删除和][最长重复子数组]详细讲解
  • [BUG] Hadoop-3.3.4集群yarn管理页面子队列不显示任务