vue过渡对宽高无效
<!doctype html>
<html>
<head>
<title>test</title>
<script src="https://cdn.jsdelivr.net/npm/...;></script>
<style>
div {
width: 100px;
height: 100px;
background-color: red;}
.v-enter {
width: 0}
.v-enter-to {
width: 100px}
.v-enter-active {
transition: all 1s;}
.v-leave {
width: 100px}
.v-leave-to {
width: 0}
.v-leave-active {
transition: all 1s;}
</style>
</head>
<body>
<div id= 'app'>
<button @click= 'change'>21</button>
<transition>
<div id= 'div' v-show= 'show'></div>
</transition>
</div>
</body>
<script>
new Vue({
el: '#app',
data:{
show: true,
},
methods:{
change() {
this.show=!this.show;
}
}})
</script>
</html>vue过渡对宽高无效是不是bug请求正确的姿势!!谢谢~~
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
不是vue的问题，你写的transation效果太简单了。
官方建议用animate.css