reactjs - React Router browserHistory 推送和 anchor

Question

使用 browserHistory 时从 React Router 4 以编程方式导航到 anchor :

import { withRouter } from 'react-router-dom'
...
props.history.push('#blah')

我可以看到地址栏中的哈希值发生变化，但页面没有滚动到相关的 anchor 。我已经用标准<a href="#blah">Blah</a>检查过了这很好用。知道我做错了什么吗？谢谢 :)

更新
刚查过<Link to="#blah">Blah</Link>也不起作用...我假设 react Links也可以使用历史对象吗？

Answer 1

经过一些调查，我决定添加一个函数来处理 componentDidUpdate 生命周期事件:

componentDidUpdate: props => {
  const selected = props.history.location.hash
  if(selected && selected.length > 0) {
    const elem = document.querySelector(selected)
    elem && elem.scrollIntoView()
  }
}

这很好地解决了问题:)