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

el-table固定表头,动态计算高度

在elementui中固定el-table表头是通过给表格设置高度来实现的。而在实际开发中开发可能无法确定表格的实际高度,因此需要动态计算表格高度

为了更好的让表格自适应可使用max-height

具体实现如下

1、给表格绑定动态高度

2、动态计算表格高度,并监听浏览器窗口变化,动态计算表格高度

// 动态计算表格高度
const tableHeight = ref(0);
onMounted(async() => {
  await nextTick();
  // 设置表格高度
  tableHeight.value = window.innerHeight - 300
  // / 监听浏览器窗口变化,动态计算表格高度,
  window.onresize = () => {
    return (() => {
      tableHeight.value = window.innerHeight - 300
    })()
  }
})

这世界很喧嚣,做你自己就好

http://www.dtcms.com/a/111733.html

相关文章:

  • 基础IO(linux)
  • 公司论坛数据构建情感标注数据集思考
  • 使用minio客户端mc工具迁移指定文件到本地
  • C++设计模式-策略模式:从基本介绍,内部原理、应用场景、使用方法,常见问题和解决方案进行深度解析
  • [GN] Python3基本数据类型 -- 与C的差异
  • 灭火器离位检测:智能视觉守护安全
  • Java异步编程实战:线框-管道模型的设计与实现
  • LabVIEW 中数字转字符串常用汇总
  • MoE Align Sort在医院AI医疗领域的前景分析(代码版)
  • Linux错误(6)X64向量指令访问地址未对齐引起SIGSEGV
  • 光流 | Farneback、Horn-Schunck、Lucas-Kanade、Lucas-Kanade DoG四种光流算法对比(附matlab源码)
  • web漏洞靶场学习分享
  • 19685 握手问题
  • 恒盾C#混淆加密卫士 - 混淆加密保护C#程序
  • 基于DrissionPage的Taptap热门游戏数据爬虫实战:从Requests到现代爬虫框架的迁移指南(含完整代码复制)
  • QML输入控件: TextArea的样式定制
  • 【python】速通笔记
  • AutoDL内网穿透、SSH连接本地VSCode
  • Windows10 中打开“网络 Internet”时状态页崩溃闪退解决方法
  • 计算机网络-TCP的拥塞控制
  • 软件工程面试题(二十六)
  • c++项目 网络聊天服务器 实现
  • 前端开发工厂模式的优缺点是什么?
  • 系统与网络安全------Windows系统安全(9)
  • YOLOv12 从预训练迈向自主训练,第一步数据准备
  • docker部署kkfileview
  • 在 Android Studio 中运行安卓应用到 MuMu 模拟器
  • 时间序列入门
  • SEO关键词与长尾词高效组合
  • Unity URP渲染管线详解