Question

文档非常简单，但是以某种方式我无法获得更新的动力。数据已正确加载到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>
    );
  }
}

Answer 1

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

FlatList应该从react-native导入，如下所示。

从“ react-native”导入{FlatList};

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

让我知道是否有帮助。

无法获取Flatlist拉动刷新工作

1 个答案: