react-router：根据正文的滚动位置改变路由

Question

我的布局左侧是固定侧边栏，右侧是内容。

内容按部分划分，部分列在侧栏中。

----------------------------
| #sidebar | #content      |
|          |               |
| - a      | - a           |
| - b      | ...           |
| - c      | ...           |
|          | - b           |
|          | ...           |
|          | ...           |
|          | - c           |
|          | ...           |
|          | ...           |
----------------------------

侧边栏正在固定，随页面滚动。

我当前的路由器是：

<Router history={browserHistory}>
  <Route path='/:category' component={App}>
    <Route path='/:category/:section' component={Content} />
  </Route>
</Router>

当页面滚动到:section内部分的标题时，我想更改#content段。

我的尝试是：

componentDidUpdate() {
  let scrollTop = this.props.scrollTop

  let activeItem = this.refs[0]
  let found = _.values(this.refs).find(function(element) {
    return findDOMNode(element).offsetTop >= scrollTop
  })
  browserHistory.replace('/' + this.props.category + '/' + found.props.slug)
}

但这样做我进入了一个循环...

如何实现结果？