在 ReactJs 中使用 NavLink 或 Link 代替 href答案

【问题标题】：Using NavLink or Link instead of href in ReactJs在 ReactJs 中使用 NavLink 或 Link 代替 href
【发布时间】：2020-05-20 05:45:01
【问题描述】：

我正在尝试使用来自“react-bootstrap”库的下拉组件中的 NavLink 或 Link 来从我的网站的标题菜单进行路由，

https://react-bootstrap.github.io/components/dropdowns/ 的标准程序

说使用href

<Dropdown.Item href="#/action-3">Something else</Dropdown.Item>

如果我使用 href 代替（而不是 Link 或 NavLink）它可以正常工作，但是在单击链接时会刷新整个页面（包括页眉和页脚），我不想刷新整个页面，只需要刷新所需的部分（正文区域) 必须刷新

我的代码如下

            <DropdownButton id="IdAbout" className="DropDownStyle" title="About" variant="none">
              <Dropdown.Item className="LinksStyle">
                <NavLink to="/">The Organisation</NavLink>
              </Dropdown.Item>
              <Dropdown.Item className="LinksStyle">
                <NavLink to="/">Our Message</NavLink>
              </Dropdown.Item>
            </DropdownButton>

我在控制台中收到此警告。

警告：validateDOMNesting(...)：不能作为 .的后代出现。

有没有办法使用链接而不是href。 This is error appears

【问题讨论】：

标签： reactjs hyperlink react-router href

【解决方案1】：

我建议你试试这个

npm install react-router-bootstrap --save

【讨论】：