javascript - 在历史模式下从子路由刷新时组件被挂载两次

标签 javascript vue.js vue-router

我在历史模式下使用 vue-router。当我在子路线“/dashboard”上刷新页面时,<ccp/>组件被安装了两次。在 ccp 组件中,我正在控制台登录创建和安装的 Hook 。我看到每个控制台输出两次。有什么想法吗?提前感谢您的关注!

编辑:在初始应用程序加载时,<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>

路由器.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
    }
  ]
 }
})

最佳答案

由于 App 组件也是您路由的一部分,它可能已安装两次。您名为 "app" 的路由正在再次安装 App。

关于javascript - 在历史模式下从子路由刷新时组件被挂载两次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52350823/

相关文章:

javascript - 如何选择最少出现的字符?

java - 数据表 - 在数据表中加载 JSON 响应

javascript - 如何在 Quasar 版本 ^0.14 中通过按钮创建 url 链接

javascript - 如果由于用户不存在而导致对 API 的后端 GET 请求失败,如何显示 404 页面?前后端分离

unit-testing - vue-test-utils : mocking vue-router and vuex in the same test

javascript - 从数组对象中组合多个数组并挑选出唯一的

javascript - 如何在关闭所有菜单的情况下加载 Accordion ?

node.js - 视觉 : Proxy requests to a separate backend server with vue-cli

具有 Vue 项目路由的 Azure 静态 Web 应用程序无法正常工作

vue.js - 使用vue-router时如何更改页面标题?