求助，vue3，其中的vueTransition失效，无法显示过度动画

如上图，这样写的情况下，过渡动画是正常显示的。
但是如果我想加上过度动画之后显示的内容，用class后，就会直接显示最终结果，没有过度动画，我看了vue的官方文档，说是给相同标签加上key，可是我transition中也没用相同标签，只有一个div。我也尝试加上了，结果也没解决。兄弟们前端的我是真不熟，谁来帮帮我

二楼附上完整的html文件

有没有可能你没加入css样式呢

不感兴趣

开通SVIP免广告

文件：【超级会员V8】通过百度网盘分享的文件：003-vueT…
链接:网盘链接
提取码:2333
复制这段内容打开「百度网盘APP 即可获取」

过渡只能应用在数值上面比如高度从0到1可以生效，如果元素一开始不存在到高度1就不行，简单来说过渡必须有确切的数值变化

v-if加过渡？你要干什么

可能我没解释清楚，我再表述一下。我想要达成的效果是：让空白页面上，点击显示/隐藏后，会出现一个不断扩大的正方形，若干秒后停止。然后保持显示这个正方形。再次点击后，过渡到消失。
如果，我不加上class，过渡动画是能正常显示出来的，但是由于过渡动画结束后，所有加载的过渡动画会被移除，那么就会变回空白页面，那么如何将过渡动画从0到1后，这个1保持不消失呢？我看的一本vue的书上，是让我添加一个class来表示最终的1，但是我这样做以后，直接从0到1了，跳过了我写的过渡动画，所以我想问问如果要想显示我这样的效果该怎么写呢？

样式调成这样就可以了

扫二维码下载贴吧客户端

下载贴吧APP
看高清直播、视频！

10回复贴，共1页

<<返回前端吧

分享到:

日	一	二	三	四	五	六