紙上得來終覺淺,絕知此事要躬行!

  Vue的文檔和教程看的太多,小的demo做的多,也不如自己實(shí)際的進(jìn)行一個(gè)完整項(xiàng)目的開發(fā)。只有做了才知道原來問題這么多,這里列舉了一些你做demo教程可能不會(huì)遇見的坑。

  一、項(xiàng)目的登錄攔截及用戶權(quán)限訪問控制問題。

  一個(gè)很常見的需求就是對(duì)未登錄的用戶進(jìn)行路由攔截和用戶的權(quán)限訪問,如果你的項(xiàng)目之前是通過后臺(tái)控制訪問路由的,那么之前的后端現(xiàn)在可能需要在前端也需要控制了,由于我們用vue腳手架搭建的都是純前端的路由訪問,先看看我們的一般的項(xiàng)目路徑:

大學(xué)生就業(yè)培訓(xùn),高中生培訓(xùn),在職人員轉(zhuǎn)行培訓(xùn),企業(yè)團(tuán)訓(xùn)

你可能會(huì)注意到Vue的項(xiàng)目路徑里都有這個(gè)#號(hào),這是一個(gè)錨點(diǎn),說明我們的頁面靠后端可能控制不了你的路由了,這時(shí)候你需要進(jìn)行Vue的路由攔截。(Vue-router 有個(gè)模式可以改為history ,但是改成這個(gè)模式后需要后端的服務(wù)有對(duì)應(yīng)的兼容,否則會(huì)造成某些頁面刷新找不到頁面,而且不會(huì)出現(xiàn)404頁面,需要自己寫路由去匹配404頁面,慎用) 。這時(shí)候我們需要在router的里面添加meta字段進(jìn)行自定義一些信息。像下面這樣:

 

大學(xué)生就業(yè)培訓(xùn),高中生培訓(xùn),在職人員轉(zhuǎn)行培訓(xùn),企業(yè)團(tuán)訓(xùn)

&

網(wǎng)友評(píng)論