Vue 路由器错误:TypeError:无法读取未定义的属性“匹配" [英] Vue-router error: TypeError: Cannot read property 'matched' of undefined
本文介绍了Vue 路由器错误:TypeError:无法读取未定义的属性“匹配"的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在尝试编写我的第一个 Vuejs 应用程序.我正在使用 vue-cli 和 simple-webpack 样板.
当我将 vue-router 链接添加到我的应用程序组件时，我在控制台中收到此错误
渲染函数中的错误:类型错误:无法读取未定义的属性‘匹配’"
这是我的代码:
App.vue
<div><h2>链接</h2><ul><router-link to='/'>首页</router-link><router-link to='/query'>查询</router-link><路由器视图></路由器视图><脚本>导出默认 {}
main.js
从'vue'导入Vue从 'vue-router' 导入 VueRouterVue.use(VueRouter)从'./routes.js' 导入路由从'./App.vue'导入应用程序const app = new Vue({el: '#app',路线，渲染:h =>h(应用程序)})routes.js
从'vue-router'导入VueRouter；让路线=[{小路: '/'，组件:需要('./Components/Home.vue')},{路径:'/查询'，组件:需要('./Components/Query.vue')}];导出默认的新 VueRouter({routes});解决方案
添加到Vue时的名称必须是router.
从'./routes.js'导入路由器const app = new Vue({el: '#app',路由器，渲染:h =>h(应用程序)})如果你想调用变量routes，你可以这样分配.
从'./routes.js'导入路由const app = new Vue({el: '#app',路由器:路由，渲染:h =>h(应用程序)})I'm trying to write my first Vuejs app. I'm using vue-cli and simple-webpack boilerplate.
When I add vue-router links to my app component I get this error in console
Error in render function: "TypeError: Cannot read property 'matched' of undefined"
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
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});
解决方案
The name when you add it to Vue must be 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 routes you could assign it this way.
import routes from './routes.js'
const app = new Vue({
el: '#app',
router: routes,
render: h => h(App)
})
这篇关于Vue 路由器错误:TypeError:无法读取未定义的属性“匹配"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
