React native listview rowhaschanged

时间:2017-10-23 02:29:35

标签: listview react-native

我正在学习反应原生的列表视图,但我一直想知道rowhaschanged的目的是什么,为什么我们必须使用它,什么时候它会被调用。我已经阅读了很多关于它的文档也有关于stackoverflow的相同问题,然后我试图通过更新listview来更好地理解它来捕获rowhaschanged但是它没有被调用。有人可以给我上述问题的确切答案,并帮我打电话给rowhaschaned。谢谢你的帮助

export default class HelloWorldApp extends Component {
  constructor (props)
  {
    console.log ();
     super(props);
     /*
     this.ds = new ListView.DataSource ({rowHasChanged: (r1,r2) => {
      console.log ('Row Has Changed was called');
      return r1 !== r2} });
      */
     this.state = {
       source :  new ListView.DataSource ({rowHasChanged: (r1,r2) => {
        console.log ('Row Has Changed was called');
        return r1 !== r2} })
     };
  }
  hitMe ()
  {
    console.log ('hit me');
    this.setState ({
      source: this.state.source.cloneWithRows([
        {name: 'Tu', age: 4},
        {name: 'Hau', age : 5},
        {name: 'Nguyen', age: 7},
        {name: 'Duy', age: 7}
      ])
    });
  }


  render () {
    return (
      <View style = { {padding: 10} }>
        <ListView
         dataSource = {
          this.state.source
         }
         renderRow = { (data) => <Text> {data.name} is {data.age} </Text> } 
        />
        <Button onPress = {this.hitMe.bind(this)} title  = 'Click me' />


      </View>




    );
  }
}

1 个答案:

答案 0 :(得分:0)

React Native将使用该比较来确定是否需要重新呈现列表的项目,或者是否可以安全地继续使用相同的视图以避免浪费资源。基本上是一个性能功能。

在您的示例中,我不认为它会再次被调用,因为行没有更改,因此您不需要重新呈现ListView。

您可以在此处查看更多信息:https://facebook.github.io/react-native/docs/performance.html

顺便说一句,您使用的是旧API。不推荐使用ListView,并且会在某些时候删除它。你应该使用FlatList。