相关疑难解决方法(0)

在react-router 4中使用锚标签

当用户通过锚链接导航到页面时,我希望页面向下滚动到我的锚标签.

我正在使用react-router 4,我已经定义了如下内容:

导航栏:

export default (props) => {
  const { 
    updateModal,
    updateRoute,
  } = props
  return(
    <Navbar fluid collapseOnSelect>
      <Nav>
        <NavDropdown eventKey="4" title="Solutions" id="nav-dropdown" noCaret>
          <MenuItem eventKey="4.1">
             <Link to='/solution#ipos'>TESTING ANCHOR</Link>
          </MenuItem>
...
Run Code Online (Sandbox Code Playgroud)

一些路线:

export default class extends Component {
  constructor() {
    super()
    this.state = {
      isLoading: true
    }
  }
  render() {
    return (
      <Grid className='solutions' fluid>
       <Row className='someClass'>
        <div>
          <h2><a href='ipos' id='ipos'>Ipos morna santos paros</a></h2>
          ...
Run Code Online (Sandbox Code Playgroud)

当我点击navebar中的锚链接时,我可以在url和我的redux商店中看到哈希锚标记,它确实导航到新路由,但它不会向下滚动到标记本身.

是由我来创建滚动功能还是它应该如何正常工作?

javascript reactjs react-router

12
推荐指数
4
解决办法
2万
查看次数

标签 统计

javascript ×1

react-router ×1

reactjs ×1