Question

我可以使用this.$router.go(-1)将用户重定向到上一条路由。但是，我无法理解在重定向之前如何获得有关先前路由的信息。

基本上，通过首先阅读先前的路由是什么，我想确保先前的路由来自同一域，然后重定向到该域，否则执行其他操作。

Answer 1

在您可以访问nuxt上下文ex: asyncData or middlewares的nuxt静态方法中：

asyncData({from}){
    // do something with from
}

但是如果你想在 vue 实例中获得 prev 路由，你可以使用

this.$nuxt.context.from

另外，请记住，如果浏览器历史记录中没有任何上一页，则 from 可以是未定义的

Answer 2

没有开箱即用的方式来获取此信息。

您可以做的是将beforeRouteEnter作为全局警卫，并在导航到新路线之前保存路线。

然后，您可以检查是否保存了以前的路线并执行this.$router.go(-1)

如果您以history模式使用路由器，则可能会想使用vue-router用来获取此信息的History API。但是HistoryApi不允许这样做，因为这将是一个巨大的隐私问题。您可以在当前标签中看到用户的全部历史记录。

Answer 3

您可以在页面中添加asyncData钩子，该钩子可以使用context属性访问from对象：

asyncData({ from }) {
    console.log(from);
  }

Answer 4

在[middleware]目录中，您可以将此脚本放置在[routing.js]中：

/* eslint-disable no-undef */
/* eslint-disable no-console */
export default function (context) {
  // current route
  console.log('route=', context.route.name)
  // previous route
  if (process.client) {
    const from = context.from
    console.log('from=', from)
  }
}

在[nuxt.config.js]中：

router: {
    ...
    middleware: 'routing'
  },

无论何时在客户端中更改当前页面，您都应该看到显示前一页的日志。也许可以帮到您。

Answer 5

您可以通过在组件/页面上实现Vue导航防护来实现此目的。

 ...
    data() {
     return {
       ...
       prevRoute: null
     }
    },
    beforeRouteEnter(to, from, next) {
      console.log(from)
      next();
    },
    ...

或者有这个人https://gist.github.com/zolotyx/b4e7fda234b3572fb7adaf11391f8eef#file-auth-js,他编写了一个脚本来帮助重定向

Nuxt-如何找到前一条路线？

5 个答案: