Vue-Router4 怎么在当前页面里获取上一个页面的路由？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

› Vue.js

这是一个创建于 849 天前的主题，其中的信息可能已经有所发展或是发生改变。

钩子只有 onBeforeRouteUpdate 和 onBeforeRouteLeave

页面

钩子

获取

onbeforerouteleave

12 条回复 • 2021-12-23 14:16:27 +08:00

weimo383

2021-12-23 10:08:37 +08:00

你只能监听路由变化，每次一变化就把他存进 store 里

1sm23

2021-12-23 10:12:26 +08:00

@weimo383 #1 只能这样吗，那不是开倒车了

sualvin

2021-12-23 10:15:43 +08:00

beforeRouteEnter 这个钩子里面的 from 参数拿不到吗？我看 4 的文档也有这个钩子啊

1sm23

2021-12-23 10:25:40 +08:00

@sualvin #3 这个钩子从哪导入，我在文档上看到了，但是页面上定义这个函数是 undefined

1sm23

2021-12-23 10:27:09 +08:00

@sualvin #3 好像 script setup 的用法不一样
这是正常的用法
```vue
setup() {
console.log('SETUP')
},
beforeRouteEnter(to, from, next) {
// Do something
next({ path: '/foo' }); // Go somewhere else if necessary
next(); // Or stay here
}
```

sualvin

2021-12-23 10:36:32 +08:00

@1sm23 #4 我刚才在 jsfiddle 试了下是可以的

sualvin

2021-12-23 10:37:36 +08:00

@sualvin #6 哦，我刚才没用 setup 的语法，就测了最基础的场景

daolanfler

2021-12-23 11:24:43 +08:00

https://next.router.vuejs.org/guide/advanced/composition-api.html#navigation-guards

daolanfler

2021-12-23 11:28:47 +08:00

@daolanfler 看错了，好像 setup 里面不支持 beforeRouteEnter ....

lin07hui

2021-12-23 11:40:03 +08:00

避免当前页面去获取其它页面的数据，刷新一下其它页面就没了

lx000377

2021-12-23 14:00:38 +08:00

在全局前置守卫或者后置钩子里把历史路由放在新路由的 meta 里,组件里用 route.meta.lastPath 读取
代码:
router.afterEach((to, from) => {
if (from) {
to.meta.lastPath = from.fullPath;
}
});
如图
https://s2.loli.net/2021/12/23/eErqCDp4Vs1oNZJ.png

1sm23

2021-12-23 14:16:27 +08:00

@lx000377 #11 想到一起去了，我现在也是这样做的哈哈