骨架屏在Vue中怎么实现才不会闪屏？
我用 Vue 做了个商品列表页，数据从接口拉取，想加个骨架屏提升体验。但每次加载完数据后，骨架屏消失、真实内容出现的瞬间会“闪一下”，看起来特别卡。我试过用 v-if="loading" 控制骨架屏和真实内容的切换，但还是有闪烁。
是不是应该用 v-show？或者需要配合 CSS 动画？有没有人遇到过类似问题？我的骨架屏是用 div 模拟的占位块，结构大概像这样：
<div v-if="loading" class="skeleton">
<div class="skeleton-item"></div>
<div class="skeleton-item"></div>
</div>
<div v-else>
<product-item v-for="item in list" :key="item.id" :data="item" />
</div>- 1
回答
22浏览
Skeleton骨架屏在Vue中怎么实现动态高度？
我用Vue做列表加载，想加个骨架屏，但每个item的高度不一样，写死height又不灵活。 试过用:style="{ height: loading ? '60px' : 'auto' }"，但切换时...
- 1
回答
18浏览
Shimmer加载效果在Vue里怎么实现才不卡顿？
我在用Vue做列表页的骨架屏，但加了Shimmer动画后页面明显变卡，尤其在低端手机上。是不是我的写法有问题？ 我试过用CSS动画配合v-for渲染多个占位块，但一滚动就掉帧。下面是我现在的代码： &...
- 2
回答
20浏览
Zoom缩放动画在Vue中怎么实现才不会闪动？
我用Vue写了个图片预览组件，想加个zoom-in的进入动画，但每次打开都先闪一下原图再放大，体验很怪。试过用transition包裹，也加了mode="in-out"，还是不行。 这是我的代码： &...
- 1
回答
21浏览
WeakMap在Vue组件里怎么用才不会内存泄漏？
我在Vue组件里想用WeakMap缓存一些DOM节点的元数据，但不确定会不会导致内存泄漏。试了下发现组件卸载后WeakMap里的引用好像还在？ 这是我的写法： <template> <...
- 1
回答
14浏览
Empty空状态组件怎么在Vue里优雅地展示？
我在用Vue做列表页，数据为空时想显示一个友好的空状态提示，但不知道怎么组织结构才合理。试过直接在v-if里写提示文字，但样式和逻辑混在一起很乱。 现在用了个简单的写法，但感觉不够通用，每次都要重复写...
- 1
回答
10浏览
Docker里部署的Vue项目怎么监控容器状态并告警？
我在服务器上用Docker部署了一个Vue项目，现在想监控容器是否挂了或者资源占用过高，但不知道怎么配置告警。试过用cAdvisor看指标，但没搞懂怎么触发通知。 这是我的Vue组件里调用的一个健康检...
- 1
回答
20浏览
环形加载进度条怎么在Vue里实现动态旋转？
我用Vue做了一个环形加载动画，但转起来特别卡，而且方向不对，明明写了顺时针却逆着转。是不是transform-origin没设对？ 试过用CSS animation配合transition，也试过直...
- 1
回答
15浏览
Vue轮播组件数据动态更新后不自动切换怎么办？
我用 Vue 写了个简单的轮播图，数据是从接口异步获取的，但图片加载完后轮播不会自动播放，手动点左右箭头却能正常切换。是不是哪里没触发响应式更新？ 我试过在 mounted 里加 this.$next...
- 2
回答
19浏览
Vuetify 的 v-data-table 分页怎么不生效？
我在用 Vuetify 的 v-data-table 做一个带分页的表格，但无论怎么设置，分页控件都显示不出来，数据也全堆在一页上。我明明加了 show-select 和 items-per-page...
- 2
回答
18浏览
自定义Vue组件的单元测试怎么写才不会报错？
我用 Vue 3 写了个带 props 和 emit 的自定义组件，想用 Vitest + Vue Test Utils 测试它，但一跑测试就报错说找不到组件实例。 我试过这样写测试： import ...
暂无解答