API transition属性介绍

发布时间：2023-04-17 12:04:13 所属栏目：教程来源：

导读：transition 属性配置 Type: String 或 Object

用于设置页面切换过渡效果的默认属性值。

默认值：

{
name: 'page',
mode: 'out-in'
}
例如 (nuxt.config.js)：

module.exports

transition 属性配置 Type: String 或 Object

用于设置页面切换过渡效果的默认属性值。

默认值：

{
name: 'page',
mode: 'out-in'
}
例如 (nuxt.config.js)：

module.exports = {
transition: 'page'
// or
transition: {
name: 'page',
mode: 'out-in',
beforeEnter (el) {
console.log('Before enter...');
}
}
}
transition 用于设置页面切换过渡效果的默认属性值。想了解当 transition 的值为对象类型时有哪些可用的属性，请参考页面过渡效果配置。

layoutTransition 属性
类型: String 或 Object

用于设置布局过渡的默认属性。配置与 layout 相同

默认:

{
name: 'layout',
mode: 'out-in'
}
例如 (nuxt.config.js):

export default {
layoutTransition: 'layout'
// or
transition: {
name: 'layout',
mode: 'out-in'
}
}
全局配置示例 css:

.layout-enter-active, .layout-leave-active {
transition: opacity .5s
}
.layout-enter, .layout-leave-active {
opacity: 0
}

（编辑：汽车网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!