过度与动画

suaxi
2022-07-17 / 0 评论 / 44 阅读 / 正在检测是否收录...
  1. 作用:再插入、更新或移除DOM元素时,在合适的时候给元素添加样式名
  2. 语法:

    (1)准备样式

    • 元素进入的样式

      • v-enter:进入的起点
      • v-enter-active:进入过程中
      • v-enter-to:进入的终点
    • 元素离开的样式

      • v-leave:离开的起点
      • v-leave-active:离开过程中
      • v-leave-to:离开的终点

    (2)使用<transition>包裹要过度的元素,并配置name属性

    <transition name="demo">
        <h1 v-show="isShow">
            孙笑川
        </h1>
    </transition>

    (3)注:若有多个元素需要过度,则需要使用:<transition-group>,且每个元素都需要指定key

0

评论 (0)

取消