导航守卫
一开始我以为导航守卫是要在写在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()就可以完成跳转了不用每次路由变化就去判断
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。