Question

我有一个Nuxt应用程序，在某种特殊的途径下，我想通过显示简单的确认JavaScript对话框来防止用户离开页面。

我在RouteLeave之前做了一些<-在Vue官方文档中对此进行了一些介绍，但是在Nuxt中似乎都没有作用。

Nuxt建议用户使用中间件来完成此“ beforeRoute”操作。这是我的代码。

export default function (context) {
    if (process.client &&
        context.from.path.includes("board/write") &&
        context.route.name !== "board-articleId") {
        if (!confirm("Are you sure you want to leave the page?")) {
            context.next(false)
        }
    }
}

如您所见，我正在检查我当前的路线是否是某个页面（context.from.path ...），请询问用户是否要离开该页面。如果取消，则确认为假，

next（false）

，它可以使用户停留在页面上，因此效果很好。

但是问题是，即使页面未更改，浏览器的加载栏仍会加载。尽管实际页面没有变化，但路线似乎仍在变化。

如何防止这种情况发生？

Answer 1

我本可以使用

git diff --name-only HEAD HEAD~1

代替

redirect(from.path)

为了提供信息，传入的参数“ context”具有以下某些属性：

next(false)

Answer 2

为确保地址栏查询（?bla=bla）未被触摸，我建议您这样做：

export default function ({ from }) {
  redirect(from);
}

如何在Nuxt中使用中间件防止用户离开页面？

2 个答案: