我正在使用Redux和React Navigation构建React Native应用程序。我无法弄清楚如何从它自己的视图中删除项目。它有一个非常简单的布局:
在详细视图中,我需要包含一个"删除"按钮,但当我更新状态(当然是不可变的)时,它仍然在查看详细视图并抛出大量错误,因为带有数据的数组元素根本不再处于状态。
我的Index.js渲染
render () {
const { navigate } = this.props.navigation
return (
<View style={{flex: 1}}>
<List>
{
this.props.inbox.map((el) => {
return (
<ListItem
key={el.ownerId}
title={el.owner}
onPress={ () => navigate('MessageView', { ownerId: el.ownerId, ownerName: el.owner }) }
/>
)
})
}
...
const mapStateToProps = (state) => {
return {
inbox: state.inboxReducer.inbox
}
}
详细信息视图
_deleteMessage () {
this.props.navigation.goBack()
this.props.deleteMessage(this.props.queued_msg._id)
}
...
render(){
<Button
backgroundColor='#E81E63'
title="Login"
onPress={this._deleteMessage.bind(this)}
buttonStyle={styles.button}
title='Delete Message' />
}
我的状态数组是什么样的:
queue: [
{
_id: 1,
owner: 'John Lennon',
owner_id: 1,
walker: 'Sally Sue',
scheduled_for: new Date(),
walker_id: 1,
message: 'Rex peed and pooped.',
logged_at: new Date()
}
...]