有没有办法使用“后退”按钮关闭模式而不篡改浏览器历史记录状态？

Question

我有一个相当具体的用例。

想象一下我从页面 A导航到页面 B（添加一个历史状态）。然后，在页面 B 上，我通过打开模式与该页面进行交互。但模式的实现方式是单击浏览器后退按钮时关闭。

当模态打开时：

ngOnInit(): void {
        history.pushState(null, null, this.pageBHomeUrl + "?modal");
    }

当它关闭时，模态状态将替换为之前的主页 url：

close(): void {
        history.replaceState(null, null, this.pageBHomeUrl);
    }

当我关闭模式时，我的浏览器历史记录如下所示（最近的在前）

• pageB主页网址
• A页

但是，我想确保可以关闭模​​式，同时将页面 A 保留为最新的历史状态...有没有办法删除 pageBHomeUrl 历史状态或向前移动 pageA 状态？或者使用后退按钮关闭模式而不更改历史状态？

Answer 1

当您从 A 导航到 B 时，您的历史记录如下所示：

• A页
• pageBHomeUrl - 当前

当您打开模式并调用 时pushState，您的历史记录将如下所示：

• A页
• pageB主页网址
• pageBHomeUrl?modal - 当前

然后，当您使用按钮并调用 关闭模式时replaceState，您的历史记录将如下所示：

• A页
• pageB主页网址
• pageBHomeUrl - 当前

这不是你想要的。而不是在处理程序中replaceState使用来从模式返回到所需的历史记录：popStateclose

• A页
• pageBHomeUrl - 当前