Vuejs2 主零部件在浏览器中重复

我有一个带有一些嵌套组件的vue项目。现在我有一个主“应用程序主页”组件，其他组件导入其中。但是，主应用程序组件显示两个版本的“应用程序主页”。在主构件内，没有其他嵌套构件重复

这是一个相当基本的项目，因为我现在正在建造这个结构。我没有重复应用程序组件中的标记

app.vue：

<template>
  <div id="app">
    <app-home></app-home>
    <router-view/>
  </div>
</template>

<script>
  import AppHome from './components/AppHome.vue'

  export default {
    components: {
      'app-home': AppHome
    }
  }
</script>

<style>

</style>

从“./components/AppHome.vue”导入AppHome
导出默认值{
组成部分：{
“应用程序主页”：应用程序主页
}
}

apphome.vue：

<template>
  <div class="page-container">
    <h1>{{ msg }}</h1>
    <app-toolbar></app-toolbar>
    <app-nav></app-nav>
  </div>
</template>

<script>
  import AppToolbar from './AppToolbar.vue'
  import AppNav from './AppNav.vue'

  export default {
    components: {
      'app-toolbar': AppToolbar,
      'app-nav': AppNav
    },
    title: 'githubrater',
    data () {
      return {
        msg: 'app home works'
      }
    }
  }
</script>

{{msg}}
从“./AppToolbar.vue”导入AppToolbar
从“./AppNav.vue”导入AppNav
导出默认值{
组成部分：{
“应用程序工具栏”：应用程序工具栏，
“应用程序导航”：应用程序导航
},
标题：“githubrater”，
数据（）{
返回{
msg:“应用程序主页工作”
}
}
}

由于某些原因，当我查看浏览器时，整个app home组件会显示两次。我在App.vue中所做的任何事情是否会导致此问题

---

谢谢

它是第一次从应用程序主组件声明中呈现的

<app-home></app-home>

第二次为：

您还添加了路由器视图，因此它将在路由器视图元素中呈现您的应用程序主页组件，因为您很可能会在路由“/”上声明应用程序主页。因此，请删除应用程序主页组件声明，并让路由器呈现应用程序主页组件。

您也可以共享您的router.js（或您定义的

路由器视图

或

路由器

）吗？也许您还将路由器设置为加载

AppHome

组件。。？