检测用户何时离开单页应用

时间:2019-01-06 19:31:47

标签: reactjs react-router

当用户尝试离开单页应用程序时,我想使用“取消”和“是”按钮弹出模式。

为了提供一些背景信息,我正在研究一个单页应用程序,该应用程序出现在一个较大的站点上,而不是该单页应用程序的一部分(因此,页眉和页脚是该较大站点的一部分,而单页-应用就是内容)。当用户尝试离开该网站的另一部分(例如通过单击导航中的某个地方)而不是该页面应用程序的一部分时,我希望显示警告模式并显示警告。用户可以根据需要关闭或刷新页面,并且该页面不应弹出模式页面。如果用户对网址进行硬编码(例如,在浏览器中为google.com),则同样的事情,应该不会弹出该模式。

到目前为止,我在stackoverflow上发现的其他类似线程都使用Prompt组件或window.onbeforeunload。两者都有一个问题,它们会弹出一个带有警告的默认文本框,而不是一个自定义模式,这是一个重要的问题,但这不是全部。

Prompt,据我了解,每当用户在单页应用内重定向 时都会触发,这不是我想要的行为。

window.onbeforeunload,即使在刷新或关闭时也无法触发,这不是我想要的行为。

也许这不是一个普遍的问题,因为我似乎无法为此找到一个简单的解决方案,但是任何想法都将不胜感激。

0 个答案:

没有答案