Element Plus 的 Loading 加载怎么在表格上局部生效? 正利 ☘︎ 提问于 2026-03-07 23:29:18 阅读 58 组件 我在用 Element Plus 的 el-table,想在数据加载时只给表格加 loading,但一加上整个页面都灰了,这是为啥? 我试过这样写: <el-table v-loading="loading" :data="tableData"> <!-- 列定义 --> </el-table> 结果 loading 遮罩盖住了整个 body,不是只遮表格。是不是还要加什么配置? 我来解答 赞 9 收藏 分享 生成中... 手机扫码查看 复制链接 生成海报 反馈 发表解答 您需要先 登录/注册 才能发表解答 1 条解答 东方爱敏 Lv1 哈哈,这个问题我也踩过坑!Element Plus 的 v-loading 默认是全屏遮罩,要让它只在表格局部生效,你得加个 element-loading-parent 配置。 正确写法应该是这样: v-loading="loading" element-loading-parent-class="table-loading-parent" :data="tableData"> CSS的话要加个定位父级: .table-loading-parent { position: relative; } 这样 loading 效果就只会限制在表格范围内了。原理就是给表格父级加了个相对定位,让 loading 遮罩的绝对定位能正确计算范围。 对了,如果你发现还是有问题,检查下表格外层是不是有奇怪的 overflow:hidden 或者没设置高度的容器。 回复 点赞 1 2026-03-08 00:02 加载更多 相关推荐 1 回答 44 浏览 Element Plus 的 Loading 加载状态怎么在 React 中用? 我照着 Element Plus 文档想在 React 项目里加个全屏 loading,但完全没效果,页面一点反应都没有。是不是我用法不对? 我试了直接套 ElLoading.service,也试了绑... 培培 Dev 组件 2026-03-18 14:36:26 2 回答 102 浏览 Element Plus 的 Loading 组件怎么在按钮点击后不显示? 我在用 Element Plus 的 Loading,想在点击按钮时显示加载状态,但调用后完全没反应。试过用指令方式 v-loading="loading",也试过服务方式 this.$loading... Zz乐佳 组件 2026-03-14 12:48:22 2 回答 134 浏览 为什么Element Plus的加载动画在表格数据加载时没有显示? 在用Element Plus的el-table做数据加载时,按照文档写了v-loading="loading",但点击加载按钮后动画一直没出现,控制台也没报错,这是怎么回事? 我已经在data里定义了... 萌新.朝阳 组件 2026-02-14 13:54:28 1 回答 49 浏览 Element Plus 表格开启虚拟滚动后数据不显示怎么办? 我用 Element Plus 的 Table 组件加了虚拟滚动,但表格直接空白了,数据明明有啊。试过设置 height 和 max-height,也按文档加了 virtual-scroll 属性,还... 风云 ☘︎ 组件 2026-03-30 10:15:14 2 回答 38 浏览 Element Plus骨架屏怎么动态控制显示和隐藏? 我用Element Plus的Skeleton做加载占位,但不知道怎么在数据加载完后自动隐藏它。试了v-if绑定loading状态,但骨架屏一闪就没了,体验不好。 这是我的代码: <templa... 码农玉戈 组件 2026-03-04 13:08:25 1 回答 42 浏览 Element Plus分页组件怎么自定义每页显示条数? 我在用Element Plus的Pagination做表格分页,想让用户自己选每页显示多少条,比如10、20、50这样。但文档里没太看懂怎么配置,试了:page-sizes="[10, 20, 50]... Designer°自立 组件 2026-03-30 10:00:14 2 回答 45 浏览 Element Plus 描述列表样式不生效怎么办? 我在用 Element Plus 的 Descriptions 组件时,想自定义 label 的宽度,但加了 CSS 好像没反应,是不是我写法有问题? 试过在组件外层加 class,也试过用 :dee... 司马玉鑫 组件 2026-03-24 17:07:19 2 回答 33 浏览 Element Plus折叠面板怎么默认展开多个项? 我在用Element Plus的Collapse组件,想让页面加载时默认展开多个面板,但试了设置activeNames为数组,好像只生效第一个。是不是我写法有问题? 我这样写的: <el-col... 书生シ嘉倪 组件 2026-03-18 09:57:20 2 回答 65 浏览 Element Plus折叠面板怎么默认展开指定项? 我用Element Plus的Collapse组件做了一个FAQ列表,但不知道怎么让其中某一项默认展开。文档里说可以用v-model绑定激活的面板,但我试了好像没生效,页面加载时还是全部收起的。 我绑... Mr-自立 组件 2026-03-16 22:02:27 2 回答 55 浏览 Element Plus 走马灯怎么设置自动轮播不生效? 我用 Element Plus 的 Carousel 组件,想让它自动轮播,但加了 autoplay 属性后完全没反应,还是得手动点。是不是还要配其他参数?我试过把 interval 设成 2000,... 西门长春 组件 2026-03-05 09:56:21
v-loading默认是全屏遮罩,要让它只在表格局部生效,你得加个element-loading-parent配置。正确写法应该是这样:
CSS的话要加个定位父级:
这样 loading 效果就只会限制在表格范围内了。原理就是给表格父级加了个相对定位,让 loading 遮罩的绝对定位能正确计算范围。
对了,如果你发现还是有问题,检查下表格外层是不是有奇怪的
overflow:hidden或者没设置高度的容器。