React Router：部分替换我的页面而不是滚动到特定部分[重复]答案

【问题标题】：ReactRouter: Section replaces my page instead of scrolling to the specific section [duplicate]React Router：部分替换我的页面而不是滚动到特定部分[重复]
【发布时间】：2021-01-06 08:30:26
【问题描述】：

所以我有一个页面，我想单击一个滚动到页面特定部分的按钮。我正在使用反应路由器，当我单击按钮时，它只是将我想要的部分替换为第一页。任何人都知道它为什么这样做？我的代码位于下面：


    const [scrollNav, setScrollNav] = React.useState(false)

    return (
        <>
             <Nav>
          <NavbarContainer>

<Router>
           <NavMenu>

                   <NavLinks  
                   > About </NavLinks>
          
                   <Link to="/Experience" 
                   >Experience</Link>
                  
                   <NavLinks>Resume</NavLinks>
                  
                   <NavLinks to="/Contact" > Contact</NavLinks>

                   <Switch>
         <Router path='/Experience'>
           <Experience/>
           </Router>
           

       </Switch>

                   
         
            </NavMenu>
            </Router>

            <MobileIcon onClick = {toggle}>

               <FaBars/>
           </MobileIcon>
          </NavbarContainer>
       
         
          </Nav>
        </>
    )
}

export default Navbar;```

【问题讨论】：

你指的是什么按钮？您的 sn-p 中没有一个。在Router 中还有一个Router`，你只需要一个（也许内部的应该是Route 组件，因为它有一个path 属性。请包括一个Minimal, Complete, and Reproducible 代码示例。跨度>

标签： javascript reactjs react-router

【解决方案1】：

这样试试

<Link to='/#Experience'></Link>

并且不要忘记将体验 ID 提供给您想要导航的组件。

<div id={'Experience'}>Content</div>

只是一个提示，您应该尽可能为 url 和 id 使用小写值。

【讨论】：

如果我想访问的页面位于不同的文件夹中怎么办？
你可以试试<Link to ='/otherpagepath/#Experience'></Link>