使用反应路由器导航时将数据从孩子传递给父母？答案

【问题标题】：Pass data from child to parent when navigating back with react router?使用反应路由器导航时将数据从孩子传递给父母？
【发布时间】：2020-04-29 18:54:24
【问题描述】：

我知道我可以在使用Link、Route 向前导航时传递数据..

<Route
  path="/release"
  exact
  render={() => <ManagedEventsList pages={this.state.pages} />}
/>

在这里：https://tylermcginnis.com/react-router-pass-props-to-components/

但是当按下浏览器后退按钮时也可以传递数据吗？

本文展示了如何在没有反应路由器的情况下从child 状态传递到parent。它可以与反应路由器一起使用吗？

https://dev.to/zeyadetman/how-to-pass-state-between-components-in-reactjs-2pg1

【问题讨论】：

标签： reactjs undo

【解决方案1】：

对于react-router-dom，不，不可能通过返回导航传递状态。 history 对象只能通过 push 或 replace 操作发送状态。 go 操作仅更新指向历史堆栈中当前位置的指针，即go(-1) 等价于goBack()。

如果您需要保留与历史堆栈相关的数据，或者如果您还需要在后退导航期间“发送”数据，那么您将需要react-router-dom 之外的库。 Redux 将是一个不错的选择，如果您已经在使用它，可以将导航期间使用的数据保存在状态中，或者与执行 history.goBack() 一起发送操作以将一些“goBack”数据保存在状态中以进行检索通过上一页的检查。其他像 Redux Sagas 或 Thunks 允许您在更新状态的同时发出副作用。有了这些，您可以创建自己的 goBackWithState 操作，在 Redux 状态中保存一些状态然后发出返回导航。

react-router-dom history

【讨论】：

总而言之，如果我使用react-router-dom，我需要使用redux？
不，它们是独立的。我只假设你引用了react-router-dom（它使用react-router）。 redux 位将是一种方式 通过您的应用传递“状态”。如果你不熟悉 redux，其他选择是滚动你自己的 react 上下文提供程序（这是 redux 使用的，顺便说一句，只是使用标准状态更新模型），或者去低保真并直接在窗口对象中设置一个值（不建议）。重点是，存在其他选项，只需选择一个适合您的需求。