该vuerouter先进导航钩的详细解释和路由单元信息
导航钩通过Vue路由器提供的导航钩主要用于拦截导航，让它完成跳跃或取消。有许多方法来执行路由时发生：全球导航钩，单路独家，或组件级。
全局钩子
你可以使用router.beforeeach前钩全球登记：
const路由器=新VueRouter（{…}）
Router.beforeEach（（，，下）= > {
…
}）
当导航被触发时，按创建顺序调用全局钩子之前的钩子。钩子是异步解析，导航等待所有钩子解析完成。
每个钩子方法接收三个参数：
目标路由对象为：路由：即将进入
从：路由：当前导航离开的路由
下一步：函数：必须调用这个方法来解析钩子。执行效果取决于下一个方法的调用参数。
下一步（）：管道中的下一个钩子。如果所有的钩子都完成了，导航的状态被确认（确认）。
下一步（false）：中断当前的导航。如果浏览器的URL更改（可能是用户手册或浏览器后退按钮），那么URL地址将被重置为从路由地址。
下一步（）或下一步（{ }：}）：跳转到另一个地址。当前导航被中断，并执行一个新的导航。
确保调用下一个方法，否则钩子将无法解决。
也可以注册一个全局的后钩子，但与前面的钩子不同，后钩子没有下一个不能改变导航的方法：
router.aftereach（路线= > {
…
}）
你可以定义beforeenter钩直接在路由配置：
const路由器=新VueRouter（{
路线：{
{
路径：，
组件：富，
beforeenter：（，，二）= > {
…
}
}
}
}）
这些钩子和钩子前的全局钩子相同。
组件中的钩子
最后，您可以在路由组件中直接定义以下路由导航挂钩。
beforerouteenter
beforerouteupdate（2.2加）
beforerouteleave
常量{ { { {
模板，
beforerouteenter（，，下）{
在呈现相应的路由组件之前，请确认
不是！可以！获取组件实例这个
因为在未创建组件实例执行之前的钩子/
}，
beforerouteupdate（，，下）{
更改当前的路由，但将组件称为多路复用。
例如，对于一个动态参数，当在1和2之间跳转时，
由于组件将呈现相同的内容，因此组件实例将被重用。
您可以访问组件实例
}，
beforerouteleave（，，下）{
当调用相应的路由导航/离开组件时
您可以访问组件实例
}
}
的beforerouteenter钩不能访问这个因为钩在导航确认称，所以这是场上的新部件还没有创建。
但是，您可以通过向下一个传递一个回调来访问组件实例。当确认导航时，回调函数被执行，组件实例被用作回调方法的参数。
beforerouteenter（，，下）{
下一个（VM { { {）
通过VM的示例访问组件
}）
}
路由的元信息
你可以直接在beforerouteleave。这把钩通常是用来防止用户离开突然才得救。导航可以取消下（假）。
在定义路由时，可以配置元字段：
const路由器=新VueRouter（{
路线：{
{
路径：，
组件：富，
孩子们：{
{
路径：'bar，
组件：酒吧，
元字段
元：{ requiresauth：true}
}
}
}
}
}）
那么如何访问元字段呢
首先，我们将路由配置中的每个路由对象称为路由记录，路由记录可以嵌套，因此当路由匹配成功时，他可以匹配多条路由记录。
例如，根据路由配置以上， / /栏URL匹配foo父路由记录和subroute记录。
所有的路由记录路由匹配将暴露在美元的美元route.matched阵列路由对象（在导航钩的路由对象）。因此，我们需要遍历$ route.matched检查元场域的路由记录。
下面的示例显示在全局导航钩子中检查元字段：
Router.beforeEach（（，，下）= > {
如果（to.matched.some（记录=记录。元。requiresauth））{
/ /这路线需要认证检查记录
重定向到 /如果没有，登录页面。
如果（！Auth.loggedIn（））{
二（{
路径：登录，
查询：{重定向到绝对}：。
}）
{人}
（下）
}
{人}
（下一步）肯定会调用下一个（）
}
}）
以上是本文的全部内容，希望能对您有所帮助，希望大家多多支持。