Nuxt v2.15.8设置页面过渡mode为空字符串不生效，求助

根据官方文档说明，Nuxt页面默认过渡模式为out-in，设置mode: ''可实现进出过渡同时运行，但在v2.15.8版本中此设置未生效，更换为in-out模式则正常。结合你的代码和场景，可从以下几点排查解决：

1. 修复页面定位问题（核心原因） #

默认情况下，Nuxt页面元素处于文档流中，若未设置绝对定位，进出页面会占据空间导致过渡时无法重叠显示，看起来像是没有同时运行。需添加全局样式确保页面重叠：

.page {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
}

Nuxt的页面根元素默认带有page类，上述样式可让两个页面在过渡时重叠，从而呈现同时滑动的效果。

2. 调整mode的设置方式 #

若空字符串仍不生效，可尝试将mode设为undefined，直接恢复Vue过渡的默认行为（同时运行进出过渡）：

• 页面级别设置：

export default {
  name: 'Page2',
  transition: {
    name: 'fwd',
    mode: undefined
  }
}

• 全局配置（nuxt.config.js）：

export default {
  pageTransition: {
    name: 'fwd',
    mode: undefined
  }
}

3. 验证过渡类名的匹配 #

确保页面跳转时对应的过渡类名正确应用：比如前进用fwd、后退用back时，需在路由跳转时动态切换过渡name，可通过beforeRouteUpdate或Nuxt的transition钩子实现类名切换。

内容的提问来源于stack exchange，提问作者Russ Back