阵营scrollTo /获取元素/组件

问题描述：

下面这段代码滚动到顶部的Y位置，也接受延迟：阵营scrollTo /获取元素/组件

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}); 
    } 
});

我怎样才能实现类似的东西，但用我的主导航？有没有计算元素偏移量的方法？然后我可以代替顶部通过这个。

你是什么意思使用您的主要导航？ – juancab

@juancab我在我的应用程序中有一个主导航，我想滚动到相应的点击部分（例如，主页，关于，联系人等）。我已经与** scrollIntoView **一起工作，但其流畅的行为仅适用于** Firefox **，因此它跳转而不是滚动。 – Manu

答

使用库来实现。请参阅react-scroll。这是基本滚动和平滑滚动的指令。

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

我已经检查过（以及其他图书馆）。我在跳跃寻找一种不需要图书馆的方法。我会考虑的，谢谢！ – Manu

我会使用第三方库来解决这个问题。这不是主流的做法，而像反应卷轴这样的小工具可以让你头痛。 PS：如果这解决了您的问题，我想通过点击绿色的复选标记，请您[接受我的回答]（https://meta.stackexchange.com/a/5235/343165）。这向更广泛的社区表明，您已找到解决方案，为您和我提供了一定的声誉，并且可以通过发现您的问题来帮助人们解决类似的问题。 –

阵营scrollTo /获取元素/组件

相关推荐