router.js :

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

export default () => {
    return new Router({
        routers,

        // mode預設值為'hash',改為'history'後可去掉路由上的#
        mode: 'history',


        // 在該專案下所有應用通過vue-router的pai跳轉的url上加一個/base/
        // 如 http://localhost:8080/login =>
 
  http://localhost:8080/base/login 
        // 非強制性，即 手動輸入的url是否帶上/base/都不影響路由跳轉
        base: '/base/',


        // 這兩個配置項的作用是：在路由跳轉的a標籤(router-link內部實現用的是a標籤)的class上增加這裡配置的值，比如 我們可以寫一些全域性class來指定連結被啟用的時候應該顯示什麼樣的樣式
        // linkActioveClass與linkExactActiveClass區別：當前所處的路徑下是'linkActioveClass linkExactActiveClass'
 
，非當前路徑是'linkActioveClass'
        linkActiveClass: 'active-link',
        linkExactActiveClass: 'exact-active-link',



        // 用於設定 路由跳轉後是否儲存當前頁面滾動條的位置
        scrollBehavior (to, from ,savedPosition) {
            // to：即將跳轉的路由物件
            // from：當前路由的物件
            // savedPosition：當前頁面滾動條的位置物件 
            if
 
 (savedPosition) {
                return savedPosition
            } else {
                return { x: 0, y: 0}
            } 
        }


        // 用於自定義對路由上的引數進行轉換時的操作
        // 即 http://localhost:8080/login?id=123&type=str 的引數('id=123&type=str')自定義處理方式(覆蓋預設的處理方式)
        parseQuery () {},
        stringfyQuery () {} ,


        // 預設為true，當設定為false時，是針對少數不支援history這種前端路由方式的瀏覽器時fallback為hash的模式，此時單頁應用就變成多頁應用
        fallback: true
    })
}