在历史记录模式下从子路径刷新时,组件被安装了两次

时间:2018-09-16 03:57:12

标签: javascript vue.js vue-router

我在历史记录模式下使用vue-router。当我在子路线“ / dashboard”上并刷新页面时,<ccp/>组件将安装两次。在ccp组件中,我是控制台登录到已创建并已安装的挂钩中。我看到每个控制台输出两次。有什么想法吗?预先感谢您的光临!

编辑:在初始应用加载时,<ccp/>仅创建并安装一次。

代码如下:

App.vue:

<template>
    <div v-show="isConnected">
      <ccp/>
      <router-view/>
    </div>
</template>

<script>
     // blah blah blah - doing stuff and then pushing route to /dashboard
    return this.$router.push({name: "dashboard"});
</script>

router.js

export default new Router({
mode: "history",
routes: [
// DEFAULT ROUTE
{
  path: "/",
  name: "root",
  alias: store.getters.isDemoMode ? "/demo" : "/app" // isDemoMode is false for this test however I wanted to show the alias config in case that is part of the problem.
},

{
  path: "/demo",
  name: "demo",
  component: Demo
},
{
  path: "/app",
  name: "app",
  component: App,
  children: [
    {
      path: "/dashboard",
      name: "dashboard",
      component: Dashboard
    }
  ]
 }
})

1 个答案:

答案 0 :(得分:1)

由于App组件也包含在您的路线中,因此它已被安装两次。您名为"app"的路线正在重新安装App。