vue过渡动画

vue中css过渡

多标签名过渡时，如果标签名相同，必须在标签中加入key属性来对标签进行区分，否则动画不执行。

<transition name="fade">
  <p v-if="show" key="1">hello</p>
  <p v-else key="2">world</p>
</transition>

当然，您也可以使用不同标签名来区分，这样就不必添加key属性了，动画也能如愿执行。

<transition name="fade">
  <p v-if="show">hello</p>
  <div v-else>world</div>
</transition>