vue項(xiàng)目原本是用0.x版本的vue-router侵歇,但是去報(bào)出:Cannot read property 'component' of undefined
這是因?yàn)榘姹締?wèn)題肄渗,由于vue2刪除了vue1的內(nèi)部指令琳猫,而vue-router1.x依賴vue的一個(gè)內(nèi)部指令
研究了下vue-router官網(wǎng),小白我用了接近一天來(lái)解決問(wèn)題洽议,最后我將vue-router改為2.2.0版本
1.打開(kāi)package.json? 將"dependencies"中的? ?"vue-router"版本改為:"^2.2.0"
2.npm install
3.在App.vue中
改為 商品
(這個(gè)坑了我很久)
4.然后在main.js中(我的main.js是這樣的【2.2.0版本】)
import Vue from 'vue';
import VueRouter from 'vue-router';
import App from './App';
import goods from './components/goods/goods';
import seller from './components/seller/seller';
import ratings from './components/ratings/ratings';
//使用模塊化機(jī)制編程,導(dǎo)入Vue和VueRouter殉疼,要調(diào)用 Vue.use(VueRouter)
Vue.use(VueRouter);
//定義路由
var routes=[
{path:'/',redirect: '/goods'},
{path:'/goods',component:goods},
{path:'/ratings',component:ratings},
{path:'/seller',component:seller}
]
//創(chuàng)建 router 實(shí)例欢搜,然后傳 `routes` 配置
var router=new VueRouter({
linkActiveClass: 'active',
routes
});
//=>
是ES6的箭頭語(yǔ)法
new Vue({
el:'#app',
router,
render:h=>h(App)
})
vue-router官網(wǎng):https://router.vuejs.org