如何使用来自单独组件文件的React Router导航链接?

阿肖克

我有标头组件,它在单独的.js文件中具有导航。

<Router>
  <h1>AshoKart</h1>
    <div className="cart">
      <span>Cart (0 items)</span>
      <Link to='/checkout'>Checkout</Link>
    </div>
    <br />
    <nav>
      <Link to='/'>Home</Link>
      <Link to='/about'>About</Link>
    </nav>
 </Router>

我在App.js文件中有路由路径详细信息。

<Router>   
  <Route path="/" exact>      
    <Home />
  </Route> 
  <Route path="/about">      
    <About />
  </Route> 
  <Route path="/checkout">      
    <Checkout />
  </Route> 
</Router>

当我单击链接时,它没有导航。但是,如果我在app.js文件中添加导航链接,则可以正常工作。您能告诉我如何使导航链接从单独的文件工作吗?

谢谢

贾廷·坎博伊(Jatin Kamboj)

<router/>与下面的代码相同,删除Header组件中的。它现在应该导航。

<div>
                          <h1>AshoKart</h1>
                        <div className="cart">
                            <span>Cart (0 items)</span>
                                <Link to='/checkout'>Checkout</Link>
                        </div>
                        <br />
                        <nav>
                                <Link to='/'>Home</Link>
                                <Link to='/about'>About</Link>
                        </nav>
    </div>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在react-router 4中单击导航链接后如何加载页面

来自分类Dev

react-router-dom链接无法导航到目标页面的开始

来自分类Dev

如何使用 react-router 4 导航嵌套组件

来自分类Dev

在脚本中使用来自链接游戏对象的组件

来自分类Dev

如何使用来自 react-router-dom 的 Mocha 测试“NavLink”

来自分类Dev

使用来自React-Router的onClick on Link

来自分类Dev

React Router深层链接

来自分类Dev

如何设置导航链接底部的导航品牌

来自分类Dev

React-Router链接,如何触发来自另一个组件的链接上的点击事件

来自分类Dev

使用链接测试React Router

来自分类Dev

React Router和导航按钮

来自分类Dev

React Router导航栏示例

来自分类Dev

React Router动态导航面板

来自分类Dev

持久导航 React-Router

来自分类Dev

如何使用React Router在React中仅在App组件上显示链接而不在子组件上显示链接?

来自分类Dev

如何使用能够在React Router中导航的持久标头组件?

来自分类Dev

使用React Router的导航测试失败

来自分类Dev

使用来自单独文件的 sed

来自分类Dev

使用循环将来自单独链接的单独文件中的子集文件串联起来

来自分类Dev

设置React Router链接的样式

来自分类Dev

React Router v4 将导航栏移动到单独的文件

来自分类Dev

单击导航链接时如何向下滚动到导航栏

来自分类Dev

如何将导航栏链接移至导航栏的右侧?

来自分类Dev

单击导航链接时如何向下滚动到导航栏

来自分类Dev

React - 从其他链接导航到部分

来自分类Dev

React-Router组件未在<Link>导航上更新

来自分类Dev

如何使用React正确设置react-router-dom链接

来自分类Dev

React Router确认导航到页面

来自分类Dev

如何将导航链接下移

Related 相关文章

热门标签

归档