javascript - 如何在 react 路由器中加载下一页之前等到服务调用完成

Question

我的应用有四种形式的问题。当组件卸载时，表单的每一页都会执行 POST。这是业务要求，只要用户离开页面，就会发布表单信息，因此我无法将逻辑移至页面上的“下一步”按钮。

当表单的下一页加载时，它需要执行 GET。我的问题是 POST 可能需要一些时间，因此 GET 在 POST 之前被调用。

在将用户路由到发生 GET 的表单的下一页之前，如何等待 POST 服务调用完成。

这是我在表单第一页中的内容。 onSubmit 触发到下一页的路由，然后当组件卸载时，它会在到达下一页之前进行需要完成的服务调用。

componentWillUnmount() {
    this.props.postServiceCall();
}

onSubmit = () => {
    routeToNextPage();
};

在下一页我有 GET，它在我的 POST 完成之前完成。

componentDidMount() {
    this.props.getServiceCall();
}

我正在使用 React 路由器。特别是浏览器路由器。提醒:我无法将 POST 更改为与 onSubmit 一起发生。每次用户离开页面时都需要发布该帖子，以便将他们的数据保存到服务器。

任何想法都会有所帮助!

Answer 1

您必须使用 localStorage 来发送网络请求。始终建议将部分信息存储在 localStorage 中，以解决像您的情况这样的小问题。您可以随时从 localStorage 检索信息。无论如何，ajax 调用是异步的，我们无法确定之前的请求是否已保存在我们的数据库中。