我试图通过触摸来删除我的单位列表中的项目,但我无法这样做。我知道我需要将触摸的索引传递给我的deleteMessage()
函数,但我不知道该怎么做。
deleteMessage(item) {
console.log("delete message!");
console.log(item);
index = this.state.messageList.indexOf(item);
console.log(index);
let newList = this.state.messageList.splice(index, 1);
console.log(newList);
this.setState({
messageList: newList
});
}
renderMessage(message) {
console.log(message.item);
return (
<TouchableHighlight onPress={()=> this.deleteMessage()}>
<Text style={styles.message}> {message.item} </Text>
</TouchableHighlight>
);
}
render() {
return (
<View style={styles.container}>
<FlatList
style={styles.listContainer}
data={this.state.messageList}
renderItem={item => this.renderMessage(item)}
/>
<View style={styles.sendContainer}>
<TextInput
style={styles.TextInputStyle}
onChangeText={text => this.handleInputMessage(text)}
placeholder="type message here"
value={this.state.message}
/>
<Button onPress={() => this.handleSubmitMessage()} title="sennd" />
</View>
</View>
);
}
}
答案 0 :(得分:3)
这样做:
deleteMessage(item) {
var messageList = [...this.state.messageList]
let index = messageList.indexOf(item);
messageList.splice(index, 1);
this.setState({ messageList });
}
...
被称为Spread Operator,在上面的代码中,它复制了this.state.messageList
数组。因此,当您对其进行任何更改时,您正在更改messageList
数组中的内容而不是this.state.messageList
数组
代码中的问题是:
您正在通过.splice()
this.state.messageList
来改变州
.splice()
会返回已删除的项目,而不会返回剩余的项目,因此,在您的状态上调用.splice()
后,您的新列表仅包含您已删除的项目< / p>
玩得开心!