javascript - browserHistory.goBack 之后发送信息

Question

我正在使用reactjs构建一个应用程序，在某些时候我有一个SearchForm，然后我单击其中一个项目，在该 View 中我有一个后退按钮。

我想要的是用以前的数据填充搜索表单。我已经通过 javascript 的 localStorage 实现了它。并将状态保存在 componentWillUnmount 上，问题是即使我没有从返回处到达，该数据也始终会加载。

有没有办法向 goBack 添加一种状态来告诉它？

Answer 1

因此，最好的方法是不使用 localStorage，而使用历史状态。

当用户更新表单时，您可以执行以下操作(可以选择对其进行反跳以获得更好的性能):

history.replaceState(this.props.location.pathname, {
  formData: JSON.stringify(formData),
});

然后当组件加载时，您可以像这样访问该状态:

const {location} = this.props;
const routeState = location.state && location.state.formData;
if (routeState) {
  this.setState({
    data: JSON.parse(routeState),
  });
}

如果他们刷新页面，或者转到另一个页面然后返回，或者返回然后前进，他们就会处于该状态。如果他们在新选项卡中打开它，他们将不会拥有该状态。这通常是您想要的流程。