如果用户滚动以快速进入React Native中的FlatLIst中的无限滚动

Question

当前我面临一个逻辑问题。我想制作一个FlatList，用户需要像Facebook一样，在其中不断向下滚动以查看更多新闻。所以基本上到目前为止，如果用户滚动到你进入无限循环的速度，我会面临一个错误，因为它不断移动和获取。

这是我的代码：

<FlatList
ref= {(list) => this.feed = list}
data={data}
onEndReached={this.onEndReached}
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={this.onRefresh}
/>
}
/>
async onEndReached() {
if (this.state.loading) return;
this.setState({ loading: true });
await fetchFeed(from);
this.setState({ loading: false });
this.feed.scrollToIndex({ viewPosition: 0.4 });
}

我的问题是，即使用户停止按下，滚动条仍然会向下滚动。我试图使用onMomentum属性，但问题仍然存在。

Answer 1

我没有使用react-native，但我会设置一个超时，并使用Boolean来阻止500 ms的任何新滚动区域。当事情发展得"很快"时，我有时会使用这种逻辑。

这是在JavaScript中可以做到这一点的几种方法之一：

var button      = document.getElementById("button");
var timeout     = undefined,
timeout2,
continue_0  = false;
function go () {
if (continue_0) {
// Your code when everything is OK here
button.innerHTML = "ON";

clearTimeout(timeout2);
timeout2 = setTimeout(() => { // just an example timeout

button.innerHTML = "OFF";
}, 500);

continue_0 = false;
} else {
if (timeout === undefined) {
button.innerHTML = "OFF";
clearTimeout(timeout2);
timeout = setTimeout(() => {
timeout     = undefined;
continue_0  = true;
button.innerHTML = "You can turn ON now";
}, 1000);
}
}
}
button.addEventListener("click", go);

<h3>Wait 1 sec. to turn "On" - After Click</h3>
<button id="button" style="padding: 30px;">OFF</button>

您也可以删除一个事件侦听器，并在X秒后重新连接它；即类似于该CCD_ 4。