vue.js - Vuejs 转换类不适用于 Vue 组件
问题描述
我正在使用VueJs转换来制作组件appVacancies
幻灯片。
<transition name="slide-down" mode="out-in" appear>
<appVacancies v-if="showVacancies"></appVacancies>
</transition>
用于过渡的Vue 特定 CSS是
// Slide Down animation
.slide-down-active, .slide-down-leave-active {
transition: all .5s ease-out;
}
.slide-down-enter, .slide-down-leave-to {
opacity: 0;
transform: translateY(20%);
}
在created()
生命周期钩子上,我只是setTimeout()
用来将showVacancies
布尔值设为true
.
我也有一个类似配置的淡入淡出动画,但这是有效的。
<transition name="fade">
<h1 v-if="!showMotion" class="display-2 grad-text mt-4">Welcome!</h1>
</transition>
// CSS
.fade-enter-active, .fade-leave-active {
transition: opacity .5s ease-out;
}
.fade-enter, .fade-leave-to {
opacity: 0;
}
我不知道我在这里做错了什么。请帮忙。
解决方案
推荐阅读
- reactjs - useEffect 与局部变量
- sql-server - 如何将所有 ID 字段设置为主键?
- ibm-cloud - 运行 cf target 时,我得到 No org or space targets,使用 'cf.exe target -o ORG -s SPACE'
- c++ - dll 值 ESP 中的运行时检查失败 #0 未保存
- java - 在 App 中实现 Proguard 时出错
- android - 如何在奥利奥的应用程序图标上显示多个通知计数徽章?
- ffmpeg - FFmpeg 批量 .mov > .gif 转换
- ansible - 将寄存器的值分配给 Ansible 中的另一个变量
- prolog - 使用适当的括号格式化输出 - Prolog
- node.js - pm2 + KOA process.send 未定义