Как автоматически обновить FlatList при вставке данных в React Native?

Question

При добавлении данных с сервера GraphQL мой FlatList не обновляется. Я пытался обновить и onRefresh, но я не совсем уверен, как я это сделаю, надеюсь, кто-то может мне помочь.

<View>
    <Query query={GET_ALL_RECIPES}>
      {({loading, data, error}) => (
        loading
          ? <ActivityIndicator />
          : (
            <FlatList
              keyExtractor={(item) => item.id}
              extraData={this.state}
              data = {data ? data.allRecipes : []}
              renderItem = {({item})=>(
                <TouchableOpacity onPress={()=>{
                  this.props.navigation.navigate('Details', {details: item})
                }}>
                  <Text style={styles.textConst}>Title: {item.title} </Text>
                  <Text style={styles.textConst}>Description: {item.description} </Text>
                  <Seperator />
                </TouchableOpacity>
              )}
              />
            )
          )}
    </Query>
<View>

Answer 1

Вы должны изменить:

extraData={data}

Передав extraData = {this.state} в FlatList, мы гарантируем, что сам FlatList будет повторно визуализироваться при изменении state.selected. Без установки этого реквизита FlatList не знал бы, что ему нужно повторно визуализировать какие-либо элементы, потому что он также является PureComponent, и сравнение реквизитов не покажет никаких изменений. FlatList информация здесь