React scrollTo /获取元素/组件的Y位置

Question

以下代码滚动到顶部并接受延迟：

const ScrollToTop = React.createClass({
  getInitialState: function () {
    return {intervalId: 0};
  },

  scrollStep: function () {
    const top = 0;

    if (window.pageYOffset === top) {
      clearInterval(this.state.intervalId);
    }
    window.scroll(top, window.pageYOffset - this.props.scrollStepInPx);
  },

  scrollToTop: function (event) {
    event.preventDefault();

    const intervalId = setInterval(this.scrollStep, this.props.delayInMs);

    this.setState({intervalId: intervalId});
  }
});

如何使用我的主导航功能实现类似功能？有没有办法计算元素的偏移量？然后我可以而不是传递顶部传递这个。

Answer 1

使用库来实现这一目标。

看看react-scroll。它是基本滚动和平滑滚动的指令。

Live example可用。如果这对你有用，read the usage guidelines。