Vuejs过渡时间自动?

时间:2017-10-26 13:50:41

标签: vue.js vuejs2 vue-router

我正在使用Vuejs官方路由器,目前正致力于为不同的路线提供不同的动画,例如此处的示例:https://router.vuejs.org/en/advanced/transitions.html(请参阅“基于路线的动态转换”)

我的问题是某些转换需要特定的转换持续时间,而其他转换则不需要(我想在CSS中指定的转换)。

我已经创建了一个变量来保存传递给路由器的持续时间(与路由器中的this.transitionName相同),但我想知道是否有办法将此变量设置为'auto',路由那不需要持续时间吗?

1 个答案:

答案 0 :(得分:0)

我对你的设置知之甚少,所以我只会解决修改过渡期的问题。

正如您所知,转换正在使用css来管理转换。

我在您链接的文档(https://github.com/vuejs/vue-router/blob/dev/examples/transitions/app.js)中提供了示例,并添加了覆盖持续时间的功能。

parent

这将通过内嵌样式来覆盖持续时间 你仍然需要找到一种在/内获得预期持续时间的方法,但我会把它留给你。

你可以在这里查看一支工作笔:https://codepen.io/scorch/pen/LOPpYd 请注意,效果仅适用于{{1}}组件,因此家中的动画({{1}})不会受到影响