我有两个页面foo和bar,当每个钩子工作时,我会在控制台上打印一条消息.在vue中是一个顺序,在nuxt中是另一个顺序

Vue:

输入/foo

beforeCreate
created
beforeMount
mounted

将/foo切换到/bar

beforeCreate
created
beforeMount
beforeDestroy
destroyed
mounted 

Nuxt:

输入/foo

beforeCreate
created
beforeMount 
mounted

将/foo切换到/bar

beforeDestroy
destroyed
beforeCreate
created
beforeMount
mounted

当转换到/foo时,在vue/nuxt中,钩子会以相同的顺序触发,但是如果从一个路由切换到另一个路由,那么顺序就会改变.为什么会这样?也许我做错了什么?

Sandbox Vue
Sandbox Nuxt

推荐答案

测试Nuxt的default transition mode

export default {
  transition: {
    mode: 'out-in'
  }
}

试着把它改成

export default {
  transition: {
    mode: 'in-out'
  }
}

Vue.js相关问答推荐

为什么 Vue 在将设置脚本中的计算(computed)属性渲染到模板时找不到变量

为什么普通对象在 Vue3 中自动变成响应式的?

Vuex Mutations 和 Airbnb eslint

在 jest document.querySelector 中测试 vue 组件期间始终返回 null

如何获取 Vue 路由历史记录?

将自定义部分添加到 v-autocomplete 下拉列表

更新 vue.js 中的数据属性/对象

使用 Vee-Validate 在提交时验证子输入组件

Modal 内部的 Vue.js AJAX 调用

在 Vuejs 中计算 DOM 元素之间距离的最佳方法是什么?

取消选中单选按钮

Vue devServer 代理没有帮助,我仍然收到 CORS 错误

在 nuxt.js 页面中包含外部 javascript 文件

vue-router如何持久化导航栏?

Vuetify 数据表不显示数据

更改事件上的 Select2 在 Vuejs 中不起作用

$emit 不会触发子事件

vue 未在实例上定义,但在渲染期间引用

将鼠标悬停在 TailwindCSS 中的 div 上时显示按钮

这个业务逻辑有多少属于 Vuex?