Question

Vue.js将重新运行main.js，每次路由更改时都会在其中定义主Vue实例。这是正常现象吗？

根据vue-router文档，仅特定于路由器的组件的内容会随路由一起更改。但是，我在Vue实例创建的主钩子中添加了一个简单的控制台日志调用，每次路由更改后都会调用它。

// main.js

import App from './App.vue'

new Vue({
  created() {
    console.log('main created hook')
    this.$store.dispatch(listenToAuthChanges)
  },
  render: h => h(App),
  router,
  store
}).$mount('#app')

// /router/index.js

import Router from 'vue-router'
import routerConfig from '@/config/routes'
import { requireAuth } from './navigationGuards'

const routes = Object.values(routerConfig)
  .map(route => ({
    ...route,
    component: () =>
      import(
        /* webpackChunkName: "route.component" */
        `@/views/${route.component}.vue`
      )
  }))

const router = new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

router.beforeEach(requireAuth)

<!-- App.vue -->

<template>
    <router-view />
</template>

我希望每条路由后仅更新“ router-view”中的内容，而不会触发完整的应用重新加载，这会导致所有初始数据获取并破坏身份验证导航防护。

VueJS是否应在每次更改路线时重新运行main.js

0 个答案: