我正在尝试为React Native的天才聊天提供状态条件页脚。我在结构上创建了“ userReply”布尔变量状态,然后将自定义视图附加到了Gifted-Chat页脚视图,如下所示;
constructor(props) {
super(props);
this.onLongPress = this.onLongPress.bind(this);
this.renderFooterReply = this.renderFooterReply.bind(this);
this.state = {
messages: [],
userReply: false
};
}
这里是我长按该项目时如何更新状态; </ p>
onLongPress(ctx, currentMessage) {
this.state.currentMessage = currentMessage;
const options = [
'Reply',
'Copy Text',
'Cancel',
];
const cancelButtonIndex = options.length - 1;
ctx.actionSheet().showActionSheetWithOptions({
options,
cancelButtonIndex,
},
(buttonIndex) => {
switch (buttonIndex) {
case 0:
this.setState({userReply: true});
break;
case 1:
Clipboard.setString(currentMessage.text);
break;
}
});
}
当我单击“回复”按钮后,应呈现此视图;
renderFooterReply() {
alert(this.state.userReply);
if (this.state.userReply) {
return (
<View style={{height: 50, flexDirection: 'row'}}>
...
</View>
);
}
return null;
}
最后,我如何将自定义视图设置为有才华的聊天页脚;
render() {
return (
<GiftedChat
messages={this.state.messages}
onSend={messages => this.onSend(messages)}
onLongPress={(ctx, currentMessage) => this.onLongPress(ctx, currentMessage)}
renderFooter={this.renderFooterReply}
user={{
_id: 1,
}}
/>
)
}
但是,当“ userReply”状态更改时,页脚不会重新呈现。谢谢。