更新 this.state.dataSource 不会更新 ListView [英] Updating this.state.dataSource doesn't update ListView

问题描述

我有一个 ListView 像:

I have a ListView like:

<ListView
      dataSource={this.state.dataSource}
      renderRow={this.renderMovie}
      style={styles.listView}
/>

它显示如下行:

  <View style={styles.container}>
      <TouchableHighlight onPress={this._onPressButton.bind(this,movie)}>

        <Image
          source={{uri: movie.uri}}
          style={styles.thumbnail}
        />
    </TouchableHighlight>
    <View style={styles.rightContainer}>
      <Text style={styles.title}>{movie.id}</Text>
      <Text style={styles.year}>{movie.votes}</Text>
    </View>
  </View>

我有一个函数可以用一部电影的投票"数更新 this.state.dataSource.但是这些更改并未反映在 UI 中，但是当我记录 this.state.dataSource 时，更改就在那里.我需要以某种方式重新渲染行吗?它们不应该自动改变吗?

I have a function that updates this.state.dataSource with the number of "votes" a movie has. But these changes aren't reflected in the UI, but when I log the this.state.dataSource, the changes are there. Do I need to somehow re-render the rows? Shouldn't they automatically change?

谢谢！

推荐答案

要使 React-native 重新渲染行，您需要创建数组的副本，更新您的对象，然后对新创建的对象使用 setState大批.例如:

To make React-native re-render the rows, you need to create a copy of the array, update your object, and then use setState with your newly created array. For example:

let newArray = this.state.dataSource.slice();
newArray[indexToUpdate] = {
  ...this.state.dataSource[indexToUpdate],
  field: newValue,
};
this.setState({
  dataSource: this.state.dataSource.cloneWithRows(newArray),
});

参考:

• React-Native 更新列表视图数据源
• 当数据源数组中对象的属性为改变了#4104

这篇关于更新 this.state.dataSource 不会更新 ListView的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！