React 路由器 - 如果 post 列表中的内容与自己的页面不同

React router - different content if post in list vs own page

React router 有一个非常酷的功能:如果你有一个项目列表(例如 Instagram),如果你点击一个项目,内容会在 modal/overlay 中打开,但如果你复制粘贴link 到新的 tab/window 或与朋友分享 link,例如,它在自己的页面中打开。


我很想使用这个功能,但我需要找到一个自定义的解决方案。


但是,当用户共享 link 或在新的 tab/page 中打开它时,来自 1st table 的数据不存在。我需要整合一个条件逻辑:

  • 如果post在列表视图中打开(modal/overlay),仅获取额外的2nd table数据
  • 如果在自己的页面中以新的tab/window打开,获取所有数据,1st table included

如何将它与 React 路由器集成? 有没有人已经尝试过?当用户在页面视图中打开项目时,这也将允许使用不同的 layout/components。有办法检查吗?

还是我的逻辑有问题?我想列表会更新得非常快,因为它不需要大量数据,而且 modal/overlay 因为它会回收一些数据。

我阅读了所有文档,也进行了在线搜索 - 没有找到任何内容。

React Router 中的模式很棒。我使用了 pinterest 示例并根据我自己的需要对其进行了调整。

确保在主布局组件中检查 state.modal===true 以提供模态样式。

您需要检查 table 1 stuff 是否存在于您的状态中,并分派一个操作来触发 componentDidMount 中的异步调用。您应该在所有情况下获取 table 2。