Question

我有一个通过cordova / phonegap在iOS上运行的React应用程序。

在一个组件中，我有一个工具栏，一旦滚过它就会粘在屏幕顶部：

<div id="content">Some stuff in here</div>
<div id="tool-bar">
    <div class="tool">Tool 1</div>
    <div class="tool">Tool 2</div>
</div>
<div id="some-stuff-below-toolbar">Stuff</div>

你明白了。

每当用户滚动时，都会计算Y位置，如果它位于偏移量之下，则工具栏会出现“粘性”等级。和CSS将其修复到顶部：

ReactJS：

componentDidMount() {
    document.addEventListener('scroll', this.updateScrollY);
    document.addEventListener('touchmove', this.updateScrollY);
}

updateScrollY() {
    const current_y = window.pageYOffset || document.documentElement.scrollTop;

    this.setState({...this.state, current_y});
}

render() {
    let classNames = '';
    if(this.state.current_y >= this.state.offset) {
        classNames = 'sticky';
    }

    return(...some JSX...
        <div id='tool-bar' className={classNames}> ... etc more JSX);  
}

CSS：

.sticky {
    position: fixed;
    top: 0px;
    left: 0px;
}

现在，这一切都适用于Chrome / Safari，但在iOS / Cordova上，动态滚动期间不会触发滚动事件。因此，如果用户在按住屏幕时滚动超过偏移限制，那很好，因为touchmove事件会持续发射。但是，如果用户滚动一点，释放屏幕，动量/惯性滚动使视图滚动超过偏移量，滚动结束之前没有任何事情发生（因为那时scroll事件被触发）。

问题：

我可以听一个单独的事件，还是有Cordova 在惯性/动量期间使javascript执行的设置滚动？

的setInterval（）

我还尝试在touchend上设置一个间隔（用户停止滚动/触摸）并稍后删除它，但似乎在动量/惯性滚动期间，根本没有运行javascript：setInterval不会＆＃39 ; t在那段时间内执行。

在Cordova iOS w / React

0 个答案: