React 路由器：在每个 <Link> 导航上执行自定义功能

Question

抱歉，如果这已经得到回答。但是有没有办法在每个 <Link> 导航上执行自定义函数？最好不要创建自定义 <Link> 包装器。

我想在我的应用程序中的每次导航之前将一些信息放入 sessionStorage。

谢谢

原文由 Matúš Čongrády 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可以使用 onClick 执行任何操作，例如

<Link
  to="/"
  onClick={() => console.log('Heading to /')} />

将 console.log 替换为执行 sessionStorage 更新等的函数，仅此而已。

---

另一种方法是使用 onEnter 道具 Route 组件在每个路由输入中执行某个函数：

 <Route
  path="/"
  component={App}
  onEnter={() => console.log('Entered /')} />

请参阅 react-router 和 react-redux 的 参考 或示例。

原文由 rishat 发布，翻译遵循 CC BY-SA 3.0 许可协议