vue 路由配置（多種路由類型的可分開書寫路由? 然后統(tǒng)一引入）
import {routers, otherRouter, appRouter}from './router';
Vue.use(VueRouter);
總體路由的配置
const RouterConfig = {
? ?mode: 'history',//?是否顯示#號在路由連接前
? ? routes: routers//路由注入
};
export const router =new VueRouter(RouterConfig);在路由中把配置項進行引用
在路由頁面里面配置
const?appRouters=[
{path:'/XXX',name:'AAA',component: Main,children:[{path:'/xxx',name:'aaa',component:()=>{import('../../..')}}]}
]
export const routers=[appRouters,otherRouters];
路由重定向；{path:'xxx',redirect:'path',component}
除了使用?<router-link>?創(chuàng)建 a 標(biāo)簽來定義導(dǎo)航鏈接，我們還可以借助 router 的實例方法，通過編寫代碼來實現(xiàn)。
#router.push(location, onComplete?, onAbort?)
注意：在 Vue 實例內(nèi)部，你可以通過?$router?訪問路由實例。因此你可以調(diào)用?this.$router.push。
想要導(dǎo)航到不同的 URL，則使用?router.push?方法。這個方法會向 history 棧添加一個新的記錄，所以，當(dāng)用戶點擊瀏覽器后退按鈕時，則回到之前的 URL。
當(dāng)你點擊?<router-link>?時，這個方法會在內(nèi)部調(diào)用，所以說，點擊?<router-link :to="...">?等同于調(diào)用?router.push(...)。
聲明式編程式
<router-link :to="...">router.push(...)
該方法的參數(shù)可以是一個字符串路徑，或者一個描述地址的對象。例如：
// 字符串router.push('home')
// 對象router.push({path:'home'})
// 命名的路由router.push({name:'user',params:{userId:123}})
// 帶查詢參數(shù)，變成 /register?plan=privaterouter.push({path:'register',query:{plan:'private'}})
注意：如果提供了?path，params?會被忽略，上述例子中的?query?并不屬于這種情況。取而代之的是下面例子的做法，你需要提供路由的?name?或手寫完整的帶有參數(shù)的?path：
constuserId=123
router.push({name:'user',params:{userId}})
// -> /user/123router.push({path:`/user/${userId}`})
// -> /user/123// 這里的 params 不生效router.push({path:'/user',params:{userId}})
// -> /user
同樣的規(guī)則也適用于?router-link?組件的?to?屬性。
在 2.2.0+，可選的在?router.push?或?router.replace?中提供?onComplete?和?onAbort?回調(diào)作為第二個和第三個參數(shù)。這些回調(diào)將會在導(dǎo)航成功完成 (在所有的異步鉤子被解析之后) 或終止 (導(dǎo)航到相同的路由、或在當(dāng)前導(dǎo)航完成之前導(dǎo)航到另一個不同的路由) 的時候進行相應(yīng)的調(diào)用。
**注意：**如果目的地和當(dāng)前路由相同，只有參數(shù)發(fā)生了改變 (比如從一個用戶資料到另一個?/users/1?->?/users/2)，你需要使用?beforeRouteUpdate?來響應(yīng)這個變化 (比如抓取用戶信息)。
#router.replace(location, onComplete?, onAbort?)
跟?router.push?很像，唯一的不同就是，它不會向 history 添加新記錄，而是跟它的方法名一樣 —— 替換掉當(dāng)前的 history 記錄。
聲明式編程式
<router-link :to="..." replace>router.replace(...)
#router.go(n)
這個方法的參數(shù)是一個整數(shù)，意思是在 history 記錄中向前或者后退多少步，類似?window.history.go(n)。
例子
// 在瀏覽器記錄中前進一步，等同于 history.forward()router.go(1)
// 后退一步記錄，等同于 history.back()router.go(-1)
// 前進 3 步記錄router.go(3)
// 如果 history 記錄不夠用，那就默默地失敗唄router.go(-100)router.go(100)
#操作 History
你也許注意到?router.push、?router.replace?和?router.go?跟?window.history.pushState、?window.history.replaceState?和?window.history.go好像， 實際上它們確實是效仿?window.historyAPI 的。
因此，如果你已經(jīng)熟悉?Browser History APIs，那么在 Vue Router 中操作 history 就是超級簡單的。
還有值得提及的，Vue Router 的導(dǎo)航方法 (push、?replace、?go) 在各類路由模式 (history、?hash?和?abstract) 下表現(xiàn)一致。
