Question

与我提出的this question有点相关，我通过redux-simple-router＆amp; amp;和历史api进行交互时，在移动设备上找到了相当令人沮丧的错误/实施细节。 react router

我的情景很简单;我的应用程序有几个网址（使用浏览器历史记录对象很漂亮）。为了举例，我们说他们是/ /product和/contact。仅在/路线和/路线上，我有一个注册表单和一个标题组件（我也使用React），一个直接链接到该注册栏的注册按钮。

我是如何实现这一点的是我的顶级应用程序组件：

  browserHistory.listen(location => {
  if (typeof location.state === 'undefined' || location.state === null) {
    window.scrollTo(0, 0);
  }
});

在每个页面上更改，将滚动到页面顶部。但是，如果页面发生更改且位置状态为非空（例如signup），则不会以滚动方式发生任何操作。然后在处理我的/路由的呈现的页面中，检查状态以查看它是否等于signup，如果是，则滚动到注册表单组件。< / p>

使用redux-simple-router中的动作创建者

实现导航

dispatch(routeActions.push({ pathname: '/', state: 'signup' }));

在每个移动浏览器上，该操作都能完美运行。但是，在移动Chrome上，每个路由操作（无论是使用动作创建者还是来自反应路由器的Link组件触发它）都会在导航时触发页面刷新并且应用程序失去状态。因此，如果我点击注册按钮，则触发页面更改，然后状态丢失，因此当页面检查this.props.location.state时，它已被重置为空。

现在我已经对此进行了广泛的测试，我在桌面Chrome，Firefox或Safari上没有任何问题，在iOS上也适用于Firefox，Opera和Safari。每个routeActions.push操作都会触发页面更改并维护状态。

有没有人知道这里发生了什么？几个小时以来，我一直在撞墙，试图弄清楚为什么它只能在iOS上的Chrome上运行。它只是Chrome历史API的实现细节吗？如果是这样，为什么它不会影响桌面上的Chrome浏览器呢？

反应路由器＆amp; redux-simple-router在移动Chrome刷新时丢失状态

0 个答案: