如何使用反应阻止用户点击浏览器的后退按钮答案

【问题标题】：How to block user's click on back button of brower using react如何使用反应阻止用户点击浏览器的后退按钮
【发布时间】：2021-12-28 17:13:10
【问题描述】：

我有一个应用程序，每当用户单击返回按钮时，我都想问：“您可能有一些未保存的更改。您确定要返回吗？”。我怎样才能实现这种反应？我可以为此使用反应路由器dom吗？还是有其他方法？

【问题讨论】：

这有帮助吗？ stackoverflow.com/questions/25806608/…
您使用的是什么版本的react-router 和react-router-dom？在您的项目目录中运行 npm list react-router-react-router-dom 并报告。
是的..我会..它是最新的..也许 5
嗯，当前是 v6，它删除了任何类型的 Prompt 组件以阻止导航操作，并且不直接暴露 history 对象甚至执行 history.block。版本 5 确实但是这样做。您使用的版本是一个非常相关且重要的细节。

标签： javascript reactjs react-router react-router-dom

【解决方案1】：

您可以尝试使用 window.confirm 吗？

<button 
  className="btn btn-danger" 
  onClick={() => {if(window.confirm('You may have some unsaved changed. Are you sure to go back?')){
    //Your back button logic
  }}
>
  Back
</button>

【讨论】：

实际上我想阻止浏览器的后退按钮而不是应用程序中的自定义按钮
你能点击这个链接吗？ stackoverflow.com/questions/36141470/…
不..它们现在都不起作用