无法让 Flatlist 拉动以刷新工作答案

【问题标题】：Can't get Flatlist pull to refresh working无法让 Flatlist 拉动以刷新工作
【发布时间】：2020-01-08 12:02:07
【问题描述】：

文档非常简单，但不知何故我无法获得刷新工作的动力。数据在componentDidMount 正确加载，但当我尝试下拉列表时不会调用_refresh。我在 iPhone 和 Android 设备上尝试过。在 Android 上，我什至无法下拉列表（没有橡胶效果）。

这是我的代码：

export default class HomeScreen extends Component {
  static navigationOptions = { header: null };
  state = { data: [], isLoading: true };

  _fetchData = async () => {
    const data = [];
    try {
      const response = await fetch('https://randomuser.me/api/?results=10');
      const responseJSON = await response.json();
      this.setState({ data: responseJSON.results, isLoading: false });
    } catch (error) {
      alert('some error');
      this.setState({ isLoading: false });
    }
  };

  _refresh = () => {
    alert('this is never be shown');
    this.setState({ isLoading: true });
    this._fetchData();
  };
  componentDidMount() {
    this._fetchData();
  }

  render() {
    if (this.state.isLoading)
      return (
        <View style={styles.container}>
          <ActivityIndicator size="large" color="darkorange" />
        </View>
      );

    return (
      <View style={styles.container}>
        <FlatList
          data={this.state.data}
          keyExtractor={item => item.email}
          renderItem={({ item }) => (
            <FriendListItem
              friend={item}
              onPress={() =>
                this.props.navigation.navigate('FriendsScreen', {
                  friend: item,
                })
              }
            />
          )}
          ItemSeparatorComponent={() => <View style={styles.listSeparator} />}
          ListEmptyComponent={() => <Text>empty</Text>}
          onRefresh={this._refresh}
          refreshing={this.state.isLoading}
        />
      </View>
    );
  }
}

【问题讨论】：

标签： javascript react-native

【解决方案1】：

仔细检查您的 FlatList 导入。我很确定您从 react-native-gesture-handler 导入了 FlatList。如果是，则将其删除。

FlatList 应该像下面这样从 react-native 导入。

从 'react-native' 导入 { FlatList }；

如果不是上述情况，请与我分享您的样式表。

如果有帮助，请告诉我。

【讨论】：