element-ui table遇见的问题

浅浅的花香味﹌ 2023-06-17 10:56 36阅读 0赞

今天我想做一个table超出后自动加滚动条

起初我把样式放在el-table上边

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDAxMTU0Mw_size_16_color_FFFFFF_t_70][]

结果做完以后切换分页一直再闪动我就很奇怪。花费了1小时解决

最后原来不能修改原样式 然后我就再加了一层div结果没问题了，实现了滚动条

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDAxMTU0Mw_size_16_color_FFFFFF_t_70 1][]

.el-table-style\{

width:100%;

height: calc(100vh - 60px - 60px - 51px - 30px - 40px);

\}

.el-table-user\{

max-height: 100%;

overflow-y:auto;

\}

这样就可以了。

遇见了坑也挺好的 万一下次再工作中遇到就了解了。

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDAxMTU0Mw_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20191128180709475.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDAxMTU0Mw==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDAxMTU0Mw_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/201911281811149.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDAxMTU0Mw==,size_16,color_FFFFFF,t_70

发表评论取消回复

表情：

评论列表（有 0 条评论，36人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue elementUI table的slot-scope属性

参考 : [https://blog.csdn.net/qq\_34995862/article/details/89532585][https_blog.csdn.net_q

红太狼/ 2023年07月14日 08:30/ 0 赞/ 20 阅读

相关 element-ui table遇见的问题

今天我想做一个table超出后自动加滚动条起初我把样式放在el-table上边 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_1

浅浅的花香味﹌/ 2023年06月17日 10:56/ 0 赞/ 37 阅读

相关开发日常遇见的问题

1.springcloud 启动时出现莫名的ip Fetching config from server at http://192.1.1.133:8888

我不是女神ヾ/ 2023年02月21日 12:43/ 0 赞/ 23 阅读

相关 elementUI 的 table 表格改变数据不更新问题

预期效果：点击输入框旁边的图标，输入框变为可输入状态；这里控制输入的 editable 字段不是 data 原有的属性，也不是 data 赋值时就存在的字段。 ![在这里插

左手的ㄟ右手/ 2023年01月17日 09:16/ 0 赞/ 901 阅读

相关 ElementUI table标签展开行

一、概述当行内容过多并且不想显示横向滚动条时，可以使用 Table 展开行功能。官方示例： test.vue <template> <el-

末蓝、/ 2023年01月15日 14:30/ 0 赞/ 275 阅读

相关 ElementUi Table中格式化日期

先看效果： ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L

悠悠/ 2022年12月26日 10:11/ 0 赞/ 761 阅读

相关 ElementUI 设置table的内容居中

在对应的column下加align="center"即可 <el-table-column align="center"

r囧r小猫/ 2022年11月30日 04:03/ 0 赞/ 528 阅读

相关 ElementUI table 样式修改

一、概述 element-ui table 默认是白色背景，现在需要修改为黑色背景，白色文字。二、代码实现 css样式 <style> /

我不是女神ヾ/ 2022年11月01日 00:46/ 0 赞/ 40 阅读

相关 ElementUI table的行高设置

... <el-table :data="tableData" style="width: 100%" :row

淡淡的烟草味﹌/ 2022年09月12日 01:47/ 0 赞/ 547 阅读

相关 elementui Table合并单元格

<template> <div class=""> <el-table :data="listData"

喜欢ヅ旅行/ 2022年09月03日 08:28/ 0 赞/ 256 阅读