【问题标题】:Components does not render by Routes组件不按路由呈现
【发布时间】:2021-10-28 08:51:36
【问题描述】:

我正在尝试在我的 Routes 组件中呈现我的四个组件 Cart、Home、Catalog 和 Products。奇怪的是,只有我的家庭组件被渲染出来。我不知道我的代码有什么问题,希望我能得到你们的帮助!非常感谢!这是我的codesanbox链接:https://codesandbox.io/s/ecommerce-r168p?file=/src/routes/Routes.jsx

【问题讨论】:

    标签: reactjs react-router


    【解决方案1】:

    您可以使用exact props 来解决您的问题。

        <Router>
          <Switch>
            <Route path="/" exact component={Home} />
            <Route exact path="/product" component={Product} />
            <Route exact path="/catalog" component={Catalog} />
            <Route exact path="/cart" component={Cart} />
          </Switch>
        </Router>
    

    或者您可以将home 路由移到底部

        <Router>
          <Switch>
            <Route path="/product" component={Product} />
            <Route path="/catalog" component={Catalog} />
            <Route path="/cart" component={Cart} />
            <Route path="/" exact component={Home} />
          </Switch>
        </Router>
    

    在这里您可以找到详细信息https://reactrouter.com/web/api/Route 这是工作示例https://codesandbox.io/s/ecommerce-forked-vj9uz?file=/src/components/Layout.js

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-12-26
    • 2018-08-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-01-21
    • 1970-01-01
    相关资源
    最近更新 更多