问题描述
我正在尝试编写我的第一个 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屋!
更多推荐
[db:关键词]
发布评论