Vuejs2 vue路由器出现问题，不渲染我的组件，并且没有错误

js和vue路由器使用有问题，我的组件未呈现，控制台未显示错误，请按照我的代码操作：

路由器配置（/router/index.js）：

main.js：

import Vue from 'vue'
import App from './App.vue'
import router from './router'

import 'primevue/resources/themes/nova-light/theme.css'
import 'primevue/resources/primevue.min.css'
import 'primeicons/primeicons.css'
import 'primeflex/primeflex.css'

import Vuelidate from 'vuelidate'
import Card from 'primevue/card'
import InputMask from 'primevue/inputmask'
import Button from 'primevue/button'
import Sidebar from 'primevue/sidebar'
import InputText from 'primevue/inputtext';
import Message from 'primevue/message';

Vue.config.productionTip = false


Vue.use(Vuelidate)
Vue.component('Card', Card)
Vue.component('InputMask', InputMask)
Vue.component('Button', Button)
Vue.component('Sidebar', Sidebar)
Vue.component('InputText', InputText)
Vue.component('Message', Message)

new Vue({
    router: router,
    render: h => h(App),
}).$mount('#app')

app.vue：

<template>
  <Fragment id="app">
      <Header />
          <router-view />
      <Footer />
  </Fragment>
</template>

<script src="./App.js"></script>
<style src="./App.css"></style>

---

改变路线对我有好处。对于默认路由，语法不同（请参阅更多）

---

如果在路径与任何组件不匹配时需要备用路由，请执行此操作

const Foo = { template: "<div>foo</div>" };
const Bar = { template: "<div>bar</div>" };
const NotFound = { template: "<div>Page not found</div>" };

Vue.config.productionTip = false;

Vue.use(VueRouter);

const routes = [
  { path: "/NewUser", component: Bar },
  { path: "/", component: Foo },
  { path: "*", component: NotFound }
];

constfoo={template:“Foo”}；
常量条={模板：“条”}；
const NotFound={模板：“未找到页面”}；
Vue.config.productionTip=false；
Vue.use（VueRouter）；
常数路由=[
{路径：“/NewUser”，组件：Bar}，
{路径：“/”，组件：Foo}，
{路径：“*”，组件：NotFound}
];

工作执行附件

如果要创建嵌套的

路由器视图

，请在此处阅读：

---

您能分享一个有您问题的工作示例吗？我在一个链接中分享了我的研究项目，您希望我创建一个更简单的另一个示例吗？要运行您的项目链接，我必须克隆并安装所有依赖项，而且我仍然有可能不会遇到您提到的问题。更好的方法是创建一个像codesandbox这样的工作示例。我在一个问题中添加了一个带有一个简单示例的新链接我删除了一个“.default”，就像您的示例一样，它可以用来呈现一个组件，但是当我尝试导航到另一个链接时，我遇到了一个错误：[Vue warn]：nextTick中的错误：“NotFoundError:未能在“节点”上执行“insertBefore”：要插入新节点的节点不是此节点的子节点。“如果刷新页面，组件将呈现，但当我再次尝试导航时，我得到一个错误我解决了部分问题，我删除了路由（组件属性）中的”“default”“。”，但遇到另一个问题，请查看我在Shmellen post中的评论。@JoseLuizJunior我在我提供的codesandbox中没有看到错误。你能检查一下吗？很抱歉在没有反馈的情况下留下这个问题，我在从我的项目中删除一个vue片段并替换为div后解决了我的问题。我的路由开始工作正常

vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in nextTick: 
"NotFoundError: Failed to execute 'insertBefore' on 'Node': The node 
before which the new node is to be inserted is not a child of this 
node."

vue.runtime.esm.js?2b0e:1888 DOMException: Failed to execute 
'insertBefore' on 'Node': The node before which the new node is to be 
inserted is not a child of this node.
at HTMLBodyElement.n.insertBefore (webpack- 
internal:///./node_modules/vue-fragment/dist/vue- 
fragment.esm.js:5:1609)
at HTMLDivElement.e.insertBefore (webpack- 
internal:///./node_modules/vue-fragment/dist/vue- 
fragment.esm.js:5:1293)
at Object.insertBefore (webpack- 
internal:///./node_modules/vue/dist/vue.runtime.esm.js:5699:14)
at insert (webpack- 
internal:///./node_modules/vue/dist/vue.runtime.esm.js:6029:19)
at createComponent (webpack- 
internal:///./node_modules/vue/dist/vue.runtime.esm.js:5976:9)
at createElm (webpack- 
internal:///./node_modules/vue/dist/vue.runtime.esm.js:5915:9)
at updateChildren (webpack- 
internal:///./node_modules/vue/dist/vue.runtime.esm.js:6206:11)
at patchVnode (webpack- 
internal:///./node_modules/vue/dist/vue.runtime.esm.js:6309:29)
at VueComponent.patch [as __patch__] (webpack- 
internal:///./node_modules/vue/dist/vue.runtime.esm.js:6472:9)
at VueComponent.Vue._update (webpack- 
internal:///./node_modules/vue/dist/vue.runtime.esm.js:3942:19)

const routes = [
    { path: '/', component: Home },
    { path: '/NewUser', component: NewUser }
]

const Foo = { template: "<div>foo</div>" };
const Bar = { template: "<div>bar</div>" };
const NotFound = { template: "<div>Page not found</div>" };

Vue.config.productionTip = false;

Vue.use(VueRouter);

const routes = [
  { path: "/NewUser", component: Bar },
  { path: "/", component: Foo },
  { path: "*", component: NotFound }
];