时间戳

首页 > 解决方案 > 按下后退按钮时反应 JS 路由问题

reactjs - 按下后退按钮时反应 JS 路由问题

问题描述

我的一个项目中有一个奇怪的要求，要求是 - 1）在我的网络应用程序的初始加载时，它应该加载初始页面（第一页）。2）如果用户下次来，那么他应该被直接重定向到他之前离开的地方——我从 API 获取 DROP STAGE。3）当用户下次来时，他会被重定向到之前放置的页面，但是在按下返回时，他可能会被重定向到他离开页面的上一页

现在我到目前为止所做的是 -

我已经使用 react-router-dom 进行路由，但发生在我身上的事情是 -

1）用户第一次来，通过检查 API 的 DROP 阶段将他重定向到第一页 2）当用户再次出现时，他有一个 DROP STAGE（来自 API），所以我将他重定向到 DROPPED 页面。3）当用户按下后退按钮（移动设备）时，用户不会停留在页面上，而是会再次重定向到 DROPPED PAGE，因为我正在检查 componentWillMount 事件的 DROP STAGE 并且他再次被重定向。

我尝试过的解决方法是 -

1）在放置的页面上设置一个本地存储变量，并在按下后退按钮的页面上检查该变量 - 但结果是我将本地存储值设为空 2）检查页面的操作，即当用户按下后退按钮时的操作变成 POP，但问题是当用户第一次来时，动作也是 POP - 我如何在初始加载时获得动作

我怎样才能实现我的功能。请帮忙

标签： reactjsreact-router

解决方案

您需要的是一个模块，该模块仅在加载应用程序时调用一次，但无论用户首先访问哪个页面，都应该加载它。你可以做的是在你的主路由文件中添加一个空组件，它应该是第一个被调用的并且在所有路由中被调用。在组件的 componentDidMount 中，您应该在其他地方处理重定向。所以重定向只会发生一次，从而自动处理后退动作。

推荐阅读