我正在尝试在router-view
标记内呈现我的vue组件。但它给了我一个错误
TypeError:route is undefined
但我没有在任何地方使用route
这个词。这是我的代码。
App.vue
<template>
<div id="app">
<my-header></my-header>
<router-view></router-view>
<my-footer></my-footer>
</div>
</template>
outerroutes.js
import welcome from './components/welcome.vue';
import insideSystem from './components/insideSystem.vue';
import forgotPassword from './components/forgotPassword.vue';
export const routes = [
{path:'',component:welcome},
{path:'/insideSystem',component:insideSystem},
{path:'/forgotPassword',component:forgotPassword}
];
main.js
import Vue from 'vue'
import App from './App.vue'
import VueRouter from 'vue-router'
import {routes} from './outerroutes';
Vue.use(VueRouter);
const router = new VueRouter({
routes,
mode:'history'
});
new Vue({
el: '#app',
routes,
render: h => h(App)
})
我想知道route
来自哪里。
答案 0 :(得分:2)
您正在创建路由器实例,如下所示;
const router = new VueRouter({
routes,
mode:'history'
});
但是您应该将router
实例注入根vue实例中的路由器选项而不是routes
new Vue({
el: '#app',
router,
//routes, not this
render: h => h(App)
})
答案 1 :(得分:1)
在outerroutes.js
:
{path:'',component:welcome},
没有任何定义。尝试:
{path:'/',component:welcome},
此外,我不确定您需要routes
中main.js
周围的大括号:
import {routes} from './outerroutes';