Javascript Vue 路由器错误：TypeError：无法读取未定义的属性“匹配”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/44618761/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Vue-router error: TypeError: Cannot read property 'matched' of undefined
提问by Mohammad Reza
I'm trying to write my first Vuejs app. I'm using vue-cliand simple-webpack boilerplate.
我正在尝试编写我的第一个 Vuejs 应用程序。我使用vue-cli和简单的WebPack样板。
When I add vue-routerlinks to my app component I get this error in console
当我将vue-router链接添加到我的应用程序组件时，我在控制台中收到此错误
Error in render function: "TypeError: Cannot read property 'matched' of undefined"
渲染函数中的错误：“TypeError：无法读取未定义的属性‘匹配’”
Here is my code:
这是我的代码：
App.vue
应用程序
<template>
<div>
<h2>Links</h2>
<ul>
<router-link to='/'>Home</router-link>
<router-link to='/query'>Query</router-link>
<router-view></router-view>
</ul>
</div>
</template>
<script>
export default {}
</script>
main.js
主文件
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
import routes from './routes.js'
import App from './App.vue'
const app = new Vue({
el: '#app',
routes,
render: h => h(App)
})
routes.js
路由.js
import VueRouter from 'vue-router';
let routes=[
{
path: '/',
component: require('./Components/Home.vue')
},
{
path: '/query',
component: require('./Components/Query.vue')
}
];
export default new VueRouter({routes});
回答by Bert
The name when you add it to Vue mustbe router.
添加到 Vue 时的名称必须是router.
import router from './routes.js'
const app = new Vue({
el: '#app',
router,
render: h => h(App)
})
If, for whatever reason, you want to call the variable routesyou could assign it this way.
无论出于何种原因，如果您想调用该变量，routes您可以通过这种方式对其进行赋值。
import routes from './routes.js'
const app = new Vue({
el: '#app',
router: routes,
render: h => h(App)
})
回答by xgqfrms
vue & vue router & match bug & solution
vue & vue 路由器 & 匹配错误 & 解决方案
match bugs
匹配错误
solution
解决方案
name must be
router
名字必须是
router
https://stackoverflow.com/a/44618867/5934465
https://stackoverflow.com/a/44618867/5934465
OK
好的
import default module bug
导入默认模块错误
importdefault module no need{}!
import默认模块不需要{}！
回答by Hugo Ramirez
On my Vue file I had the following code:
在我的 Vue 文件中，我有以下代码：
Then, I modified my app.jsfile, and place the following code:
然后，我修改了我的app.js文件，并放置了以下代码：
import router from './Router/router.js'
const app = new Vue({
el: '#app',
router
});
