React页面不会刷新

Question

我目前的情况：

我想单击图像，然后导航到/ details页面。如果单击图像，URL会刷新，但我的组件未加载。

我尝试了一些找到的解决方案，例如window.location.reload（）。这种方法有效，但是我必须在图像上单击两次以刷新页面，但我不明白为什么？所以它不能解决我的问题。

我发现，如果将链接（无论是图像还是按钮）插入到导航栏中，则链接可以正常工作，并且页面会刷新。仅当我将链接插入页面时，它才起作用。

也许是因为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>

Answer 1

您只需要一个Router组件（应该在Switch之外），对于单独的路由，您应该使用Route。