我有两个按钮,单击一个按钮时我需要制作元素滑动 vue 过渡效果,单击另一个按钮时我需要制作元素淡入淡出 vue 过渡效果。
<template>
<transition :name="transition ? 'slide-fade' : 'fade'">
<p>Hello world</p>
</transition>
<button @click="shouldSlide">Slide</button>
<button @click="shouldFade">Fade</button>
<template>
<script>
export default {
data () {
return {
isSlide: false
}
},
computed: {
transition () {
return this.isSlide
}
},
methods: {
shouldSlide () {
this.isSlide = true
},
shouldFade () {
this.isSlide = false
}
}
}
</script>
我知道它不起作用,因为计算发生在模板更新之后。有没有其他方法可以解决这个问题。提前致谢。