Vue.js框架--路由模組化(二十六)
阿新 • • 發佈:2018-11-16
主要操作技能:
1>建立資料夾\router.js檔案
2>寫入相關路由配置 router.js
import Vue from 'vue' //0. 使用路由 import VueRouter from 'vue-router' Vue.use(VueRouter) //1. 定義 (路由) 元件。 import Home from '../components/Home.vue' import News from '../components/News.vue' import Buy from '../components/Buy.vue' //2. 定義路由 const routes = [{ path: '/home', component: Home }, { path: '/news', component: News }, { path: '/buy', component: Buy }, { //預設首頁不能有引數 path: '*', redirect: '/home' } ] //3. 建立 router 例項,然後傳 `routes` 配置 const router = new VueRouter({ routes // (縮寫) 相當於 routes: routes }) //4.匯出路由 export default router;
3>在main.js中匯入 import router from './router/router.js'