如何在 React-Native 中重新加载平面列表？

Question

我正在从 android 切换到本机反应。 完全天真。 我想在 react native 中实现类似 recyclerview 的东西，并发现了FLATLIST现在问题是最初我的数据变量是空的，后来我将数据添加到该变量中。 现在我如何通知平面列表数据已更改并且它现在应该重新呈现自身。

就像在 recyclerview 中一样，我们使用 adapter.notifyDataSetChanged(); 通知回收者视图它现在应该重新呈现自己的更改

我使用的代码是

export default class Convo extends Component{

constructor(props){
super(props);
this.state = {
  loggedIn: 'false',
  title: 'Login/SignUp',
  messages: []
};
this.downloadConversation = this.downloadConversation.bind(this);
}

componentDidMount(){
this.downloadConversation();
}

 downloadConversation(){
    this.setState(
      {message: [
        {
            key: "HIHI",
            name: "lets  this bullshit",
            message: "I i i"
          },
          {
              key: "HIHI2",
              name: "lets change  bullshit",
              message: "I i i"
            },
            {
                key: "HIHI3",
                name: "lets change this ",
                message: "I i i"
              }
      ]}
    );
//After updating the messages object, i want to notify flat list about 
//the change, basically i will be updating this object asynchronously  
// in background which will take time. for now i am updating directly 
//to show you
}


renderFlatListItem(item) {
return (
  <View key={item.key} style={styles1.flatviewItem}>
     <Text>User1</Text>
     <Text style={styles1.name}>{item.name}</Text>
     <Text style={styles1.messageStyle}>{item.message}</Text>
   </View>
   )
   }

 render(){
  return(
    <View style={styles1.container}>
      <View style={styles1.header}>
        <Text style={styles1.h2style}>Conversation List</Text>
      </View>
      <FlatList
        style={styles1.flatview}
        extraData={this.state}
        keyExtractor={item=>item.key}
        showsVerticalScrollIndicator={true}
        data={this.state.messages}
        renderItem={({item}) => this.renderFlatListItem(item)}
      />
    </View>
  );
 }

}

Answer 1

当组件状态更改时，您的组件应自动重新渲染（如果渲染方法中的任何内容引用了更改的状态）。 我认为当您在 downloadConversation() 方法中设置状态时，您只需要将“消息”更改为“消息”。 您的 FlatList 正在寻找 this.state.messages，而不是 this.state.message 并且 this.state.messages 永远不会改变。 只需修复那个错字并希望能修复它。