【发布时间】：2020-08-28 06:53:03
【问题描述】：
我现在的情况：
我想点击一张图片，然后导航到 /details 页面。如果我单击图像，则 url 会刷新但我的组件未加载。
我尝试了一些我发现的解决方案，例如 window.location.reload()。这种方法有效，但我必须在图像上单击 2 次才能刷新页面，我不明白为什么？所以它并没有解决我的问题。
我发现如果我将链接（无论是图像还是按钮）插入导航栏中，链接工作正常并且页面会刷新。仅当我将链接插入页面时，它才起作用。
可能是因为 Navbar 组件在 Switch 组件之外？ （见下文）这是唯一的区别。也许你们中的某个人有一个想法。
<React.Fragment>
<Navbar />
<Switch>
<Router exact path="/">
<ProductList />
</Router>
<Router path="/details">
<Details />
</Router>
<Router path="/cart">
<Cart />
</Router>
<Router>
<Default />
</Router>
</Switch>
</React.Fragment>
【问题讨论】：
-
我们需要更多的上下文，但在这种情况下使用 windows.location.reload() 是绝对不行的。确保您的路由器正确重定向，以便您附加在图像上的事件真正推送到
/detail页面，确保详细信息组件页面确实呈现它应该呈现的内容。 -
@vaske details 组件正确呈现页面。我什至尝试只渲染一个导航到 /details 的简单按钮，因为我认为我的代码是错误的，但无论如何它不起作用。
-
推送到/detail 是什么意思？我导航到 /details 页面的代码如下所示 { value.handleDetail(id) }}>
标签： javascript reactjs react-router