Vue回爐重造之router路由（更新中）

安裝vue-router

npm i vue-router -S



配置
1、創(chuàng)建文件夾與文件

創(chuàng)建一個(gè)router文件夾，在文件夾中創(chuàng)建兩個(gè)文件，分別是router.js和routes.js文件。
2、編輯文件

router.js（路由配置文件）

import Router from 'vue-router'
import routes from './routes'

export default ()=> {
    return new Router({
        routes,
        mode:'history',
        fallback:true //對(duì)于瀏覽器不支持history模式的，會(huì)自動(dòng)轉(zhuǎn)成hash模式
    })
}


routes.js（路由頁(yè)面文件）

import Index from '../views/Index.vue'
import Login from '../views/Login.vue'

export default [
    {
        path: '/',
        component: Index
    },
    {
        path: '/login',
        component: Login
    }
]



main.js（Vue入口文件）

import Vue from 'vue'
import App from './App.vue'
import Router from 'vue-router'
import createRouter from './router/router'
Vue.use(Router)
Vue.config.productionTip = false

const router = createRouter()
new Vue({
  router,
  render: h => h(App),
}).$mount('#app')


作者：Vam的金豆之路

主要領(lǐng)域：前端開(kāi)發(fā)

我的微信：maomin9761

微信公眾號(hào)：前端歷劫之路