如何在 FlatList 上启用或禁用滚动答案

【问题标题】：how to enable or disable scrolling on FlatList如何在 FlatList 上启用或禁用滚动
【发布时间】：2017-07-19 07:39:22
【问题描述】：

我有一个FlatList，它被包裹在一个视图中。

<View {...this._panResponder.panHandlers}>
<FlatList .../>
</View>

View 是一个panResponder，那么当onPanResponderGrant 触发时如何禁用FlatList 的滚动。

【问题讨论】：

标签： android react-native

【解决方案1】：

documentation 声明 FlatList 具有 ScrollView 的属性：

因此继承了它的 props（以及 ScrollView 的那些）

如果您检查 documentation 中的 ScrollView，您会发现您需要做的就是将 scrollEnabled 属性设置为 false 以禁用滚动。由于您没有真正发布任何代码，因此您选择如何以及在何处执行此操作将取决于您。处理这个问题的一个简单方法是使用 state：

<FlatList
  ...
  scrollEnabled={this.state.scrollEnabled}
/>

// Change the state to the appropriate value in onPanResponderGrant:
// To enable:
this.setState({ scrollEnabled: true })
// To disable:
this.setState({ scrollEnabled: false })

【讨论】：

这个道具我知道，但是好像不行，我再试试，谢谢！
它适用于我的设备，但不适用于 expo web 视图。

【解决方案2】：

您可以将 ref 保存到 FlatList 并在此 ref 上调用 setNativeProps：

this.flatList.setNativeProps({ scrollEnabled: false })

【讨论】：

【解决方案3】：

使用 ScrollView 代替 View。

【讨论】：