如何等到服务调用完成后再在React Router中加载下一页

Question

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

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

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

这是表格第一页中的内容。 onSubmit触发路由到下一页，然后在卸载组件时，进行需要完成的服务调用，然后才能到达下一页。

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

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

在下一页上，我有GET，该GET将在我的POST完成之前完成。

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

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

任何想法都会有所帮助！

Answer 1

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