我的应用程序上有一个页面,其中显示了用户发表的评论。当对编辑注释进行攻击时,模式即将打开,用户可以在其中对其评论进行编辑,并提交数据库的提交是成功的。现在,我的问题是,用户不必在查看刚刚进行的更新之前刷新页面。我希望在视图中更新编辑的文本
查看
{
postComments.map((item) => (
<ListItem
roundAvatar
hideChevron={true}
avatar={{uri:item.avatar}}
key={item.id}
title={item.author.member.firstname + ' ' + item.author.member.lastname}
subtitle={
<View >
<Text style={{paddingLeft:10, fontSize:16, color:'#4a4a4a', fontFamily:'HelveticaNeue-Light'}}>{item.text}</Text>
<View style={{position:'absolute',right:0, bottom:0}}>
<Text>
<Text
onPress={()=>callEditModal(item)}
style={{color:'#36a', fontSize:18}}>Edit | </Text>
</Text>
</View>
</View>
}
/>
))
}
<Modal
animationType="slide"
transparent={false}
visible={visible}
onRequestClose={() => {
Alert.alert('Modal has been closed.');
}}>
<View style={styles.modalContainer}>
<Header
centerComponent={{ text: 'Edit Comment', style: { color: '#fff' } }}
rightComponent={{ icon: 'close', color: '#fff', onPress: () => closeEditModal(), }}
backgroundColor= '#00aae0'
containerStyle={{
top: -20,
}}
/>
<View >
<TextInput
value={userComment}
onChangeText={setEditComment}
style={{padding:10,backgroundColor:'#fafafa', height:150}}
mode="flat" multiline={true}
numberOfLines={2} label=''
/>
<Button style={{alignSelf:'flex-end',height:50, margin:10, justifyContent:"center", width:"40%"}}
icon="send"
type='material'
mode="contained"
color="#00aae0"
uppercase={false}
onPress={() => {saveComment()}} >
Save Edit
</Button>
</View>
</View>
</Modal>
功能
saveComment = () => {
alert(this.state.userComment);
}
我如何使我进行更新?
如果 user wouldn't have to refresh the page
表示不使用 setState()
,我怀疑它是否可能。您没有说使用哪种类型的方法将数据存储在应用程序中。但是,如果您使用任何数据库,则编辑后更新数据库并从那里重新初始化您的视图(调用函数以捕获App DB的数据并将数据放在状态下,例如)。
我在反应本机中使用 realm
,因此代码就是这样:
updateState() {
const devs = realm.objects('user_devices');
this.setState({ devices: devs });
}
每当我更改DB中的东西时,我希望用户看到我称之为此方法。