我正在尝试实现类似facebook之类的路线。让我解释一下Facebook上某条路线的工作原理。当用户在首页Url is example.com/上滚动其Feed时，如果用户单击了Feed中的任何照片，则该Feed上将出现一个模式，网址也会像{ {1}}。当用户单击“后退”按钮或“关闭”按钮时，Modal会隐藏自身并返回到上一个首页example.com/photo/?urlparams，而无需重新呈现供稿。
我尝试的是
example.com/ PostLists组件具有无限滚动，因此最多可以包含90多个帖子。每个帖子都有 <Route path='/' exact render={(props) => <PostLists {...props} scroll={scroll} /> } />
<Route path='/post/:id' render={(props) => <Single {...props} scroll={scroll}/> } />
到单个组件，如下所示
Link一切正常，就像正常导航一样。但我想在PostsLits组件的模态中显示此单一组件，同时应将URL更改为 <Link to={`/post/${props.post.slug}`} className={`post-title`}>{pTitle}</Link>
所以我在帖子标题中将example.com/post/url-slug替换为
Link这与我预期的一样，但是我使用的是<span onClick={titleClick} className={`post-title`}>{pTitle}</span>
const titleClick = () => {
props.toggle(true) //Modal Toggle
return window.history.pushState(null, null, `/post/${props.post.slug}`)
}
，而不是反应的历史记录，因此我无法通过浏览器后退按钮收听URL更改。如果单击后退按钮，URL会更改为先前的window history，但是我无法隐藏模式。
我想要的是每个帖子都可以有example.com/个单独的页面来显示其内容，但是从主页单击该帖子时，它应该显示为模式，并且url应该更改为各自的帖子url {{1} }，在点击“后退”按钮时应隐藏模式，并显示PostLists。