Реакция собственных данных Flatlist не очищает даже массив данных чист - PullRequest
Новая
       5

Реакция собственных данных Flatlist не очищает даже массив данных чист

2 голосов
/ 07 марта 2019

Я написал приложение для отображения больших данных с помощью FlatList, но когда я использую приложение, Flatlist не очищает данные, пока массив данных пуст. 

renderItem = ({item}) => {
        return (
          <TouchableOpacity
            onPress={() => this.props.navigation.navigate('Detail', { item, otherParam: item.Word1})}>
            <View style={{ padding: 5, backgroundColor: '#eee'}}>
              <View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between' }}>
                <DisplayField value={item.Word1} />
              </View>
              <View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between' }}>
                <DisplayField value={item.Word2} />
              </View>
              <View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between' }}>
                <DisplayField value={item.Word3} />
              </View>
              <View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between' }}>
                <DisplayField value={item.Word4} />
              </View>
            </View>
          </TouchableOpacity>
        );
      };

Это код рендеринга 

render() {
    return (
      <View style={styles.container}>
        <SearchBar lightTheme placeholder='Enter your word' onChangeText={this.onChangeTextDelayed} />
        <FlatList style={styles.listContainer}
      data={this.state.data}
      extraData={this.state.data}
      renderItem={this.renderItem}
      keyExtractor={item => item.Word1}
      ItemSeparatorComponent={() => (
        <View
          style={{ height: 1, width: '100%', backgroundColor: '#CED0CE' }}
          />
      )}
      />
      </View>
    );
  }

Это метод извлечения данных 

retriveData = (msg) => {
      if(msg === '') {
        this.setState({data:[]});
        return;
      }

      let limStatement = '';
      let sqlStatement = "SELECT Word1, Word2, Word3, Word4 FROM MyTable WHERE Word1 LIKE '%" + msg + "%' ORDER BY lower(Word2)";
      db.runQuery(sqlStatement).then(rows => { this.setState({ data: rows }) });
  }

Поэтому, когда я печатаю для поиска в текстовом поле, Flatlist показывает данные правильно, но когда я удаляю текст поиска, он переходит к this.setState ({data: []}), чтобы очистить данные состояния, но это произошло просто в некоторой строке, которая не ушел, Пример отображения списка 

A
B
C
D
E
F
G
.
.
.

когда я очищаю поиск, это похоже на 

B
B
D
D
E
E
F
F
G
G
G

Это происходит, когда я прокручиваю вниз.

Есть идеи для этого?

...