Javascript 路由器未显示vue组件

我是新来的VueJs。我试图使用VueJs开发一个主题，我遇到了路由器的问题，“组件未显示”。这是我的密码

Pagea.vue

<template>
    <div>
        <h1>Hello This is a test</h1>
    </div>
</template>

<script>
export default {
    name : "Pagea"
}
</script>

---

没有控制台错误，但仍然没有结果。我不知道为什么组件或数据不能只显示空页。请任何人都告诉我我错过了什么。我很早就知道我是新来的，还在学习。谢谢。

更确切地说，问题在于：

<router-link to="/Pagea">Go to Bar</router-link>

徖

但是，如果这不能解决问题，请尝试以下方法：

试试下面的方法，让我知道它是否对你有用

Pagea.vue，删除导出并将类名设置为div标记：

<template>
    <div class="pagea">
        <h1>Hello This is a test</h1>
    </div>
</template>

它将使您的代码比一个文件中的所有内容更干净、更易于维护

然后可以在main.js中调用router.js

import router from './router'

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

---

在const

router

声明中使用

routes:routers

。或者，要以当前方式使用它，您应该将const

路由器

重命名为

路由

谢谢。问题解决了。谢谢您的解释和帮助：）。

<router-link to="/pagea">Go to Bar</router-link>

{ 
    path: '/pagea', /* lower-case here */
    name : 'Pagea',
    component : Pagea     
  }

<template>
    <div class="pagea">
        <h1>Hello This is a test</h1>
    </div>
</template>

<template>
  <div id="app">   
    <router-link to="/">Go to Foo</router-link>
    <router-link to="/pagea">Go to Bar</router-link>

    <router-view></router-view>

  </div>
</template>

import Vue from 'vue'
import VueRouter from 'vue-router'
import Pagea from './components/Pagea.vue';

let routes = [
  {
    path: '/pagea',
    name : 'pagea', /* Keep the name lowercase as in the className */
    component: Pagea  
  }
];

export default new Router({
 routes: ...
}

import router from './router'

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