導航守衛

一開始我以為導航守衛是要在寫在main.js中，然后看了網上很多代碼，發現這塊是可以單獨寫成一個xxx.js文件，然后在main.js中引入進來,這樣就是一個全局引入。當然在xxx.js中，需要將路由文件引入進來，不然你怎么操作路由吶。【思考臉】

然后對于next()的理解不是很透徹。

查看官網，你會發現其實人家解釋的很清楚。next() 會進行管道中的下一個鉤子，這句話其實不是太過于明白，但是通過實例，可以暫時自理解為當你的導航變化時，滿足你自己編寫的條件時，就會進入它的下一個鉤子函數中。

但當時的寫的代碼是這樣的

if (to.path == '/' || to.path == '/upload-version') {next()} else {if (to.path == '/remote-shell') {next()} else {next()}}

當時我的想法以為是，只要路由發生了變化，我在這邊就需要進行判斷來監聽一下。后來想想這樣是有問題的呀，假如我配置的路由有很多path,難道我還要一個一個去比較啊，所以上面的方法肯定是行不通的。所以我后期只判斷了一個地址。

router.beforeEach((to, from, next) => { //首先判斷是否有值 if (getPort() && getAddress()) {//有 直接給stroe賦值var ipp = { port: getPort(), address: getAddress() }console.log(ipp);//如果getters中沒有值就賦值console.log(store.getters.gethip);if (store.getters.geti == '') {console.log("有沒有有沒有沒有")store.dispatch('choicePort', ipp).then(() => {console.log(store.getters);}).catch(() => { })store.dispatch("registerMessageListener").then().catch()next()}else{next();} } else {//沒有 跳轉到選擇頁面中去，配置地址if ((to.path) == '/xxxx') {next()} else {next('/xxx');} }

直接通過next()就可以完成跳轉了不用每次路由變化就去判斷

---

這是以前提的一個問題

總結

以上是生活随笔為你收集整理的vue-router 中导航守卫问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。