【Vue】transition标签不生效
transition 标签只能包含 1 个元素;如果里面写了多个元素,则只生效第一个transition 包裹的标签需要设置 v-show / v-if 属性控制元素的显示否则不生效!动画 CSS 样式对应的类名进入:.v-enter 始状态、.v-enter-to 末状态、.v-enter-active 进入动画(Vue2)离开:.v-leave 始状态、.v-leave-to 末状态、.v-l
·
transition 标签:Vue 的内置动画标签
情况一
transition 标签只能包含 1 个元素;如果里面写了多个元素,则只生效第一个
transition 包裹的标签需要设置 v-show / v-if 属性控制元素的显示
否则不生效!
情况二
动画 CSS 样式对应的类名
进入:.v-enter 始状态、.v-enter-to 末状态、.v-enter-active 进入动画(Vue2)
离开:.v-leave 始状态、.v-leave-to 末状态、.v-leave-active 离开动画(Vue2)
进入:.v-enter-from 始状态、.v-enter-to 末状态、.v-enter-active 进入动画(Vue3)
离开:.v-leave-from 始状态、.v-leave-to 末状态、.v-leave-active 离开动画(Vue3)
注意:Vue3和Vue2的写法不同,如果你是Vue3,那就要在始状态中加入from
博主本人就是在这里踩坑的,建议大家多注意版本问题!!!
更多推荐
已为社区贡献2条内容
所有评论(0)