ListViewの更新方法は？

Question

私はプロンプトを持っています。私は新しい配列でListViewを更新する必要がありますが、私の代わりに空のListViewが表示されます。エラーはない、白い画面...どのようにそれを修正する？

sendMes（）を削除すると、アプリが動作します。

constructor(props){ 
super(props); 
var ds= new ListView.DataSource({ 
    rowHasChanged: (r1, r2) => r1 !== r2 
}); 

var Dimensions = require('Dimensions')  //определяем размеры экрана 
var {widthScr, heightScr} = Dimensions.get('window') 

var messagesArray = [ 
    {message: "Hello", style: styles.nikkiMes}, 
    {message: "Okkkk", style: styles.userMes} 
]; 

this.state = { 
    messagesSource: ds.cloneWithRows(messagesArray.slice()), 
    inputMes: '', 
    messagesArray: messagesArray 
};} 

renderMessages(rowMessages){ 
return(
    <Text style={rowMessages.style}>{rowMessages.message}</Text> 
);} 

sendMes(){ 
var ds= new ListView.DataSource({ 
    rowHasChanged: (r1, r2) => r1 !== r2 
}); 

this.setState({ 
    messagesArray: this.state.messagesArray.concat({message: this.inputMes, style: styles.userMes}), 
    messagesSource: ds.cloneWithRows(this.state.messagesArray.concat({message: this.inputMes, style: styles.userMes}).slice()) 
});} 

render() { 
return (
    <View styyle={{flex: 1, alignItems: 'center', flexDirection: 'row'}}> 
    <ListView 
     dataSource={this.state.messagesSource} 
     renderRow={this.renderMessages.bind(this)} 
    /> 
    <TextInput 
     style={{height: 50}} 
     placeholder="Type here..." 
     onChangeText={(inputMes) => this.setState({inputMes})} 
    /> 
    <TouchableHighlight onPress={this.sendMes()}> <Text>Button</Text> </TouchableHighlight> 
    </View> 
);} 

どのように新しいアイテムをListViewに追加できますか？

Answer 1

sendMes関数でデータソースを上書きしています。あなたがちょうどあなたとあなたのsetMes関数内機能の上に置いて、新しいアイテム/データ

this.setState({ 
    messagesSource: ds.cloneWithRows(this._generate_new_items()), 
}); 

を状態を更新し、あなたのリストビューで更新されます新しいアイテムを生成する新しい機能「_generate_new_items」を作成リストビュー更新します。ヘルプについて

_generate_new_items(){ 
    var dataBlob = []; 
    for (var ii = 0; ii < 100; ii++) { 
     dataBlob.push('Row ' + ii); 
    } 
    return dataBlob; 
} 

がhttps://facebook.github.io/react-native/docs/listview.html

を参照してください：あなたは、以下のような_generate_new_items機能の何かを持つことができます