我在一个聊天应用程序上工作过,当其中一个回复上的用户选项卡在聊天 UI 中显示为用户消息时,我想创建一个功能,我想知道他选择了哪个快速回复,有人帮助我吗?这是下面的代码:
import React, { Component } from 'react';
import { StyleSheet, Text, View, Image } from 'react-native';
import { GiftedChat } from 'react-native-gifted-chat';
class App extends Component {
state ={
messages: [
{
_id: 1,
text: 'This is a quick reply. Do you love Gifted Chat? (radio) KEEP IT',
createdAt: new Date(),
user: {
_id: 2,
name: 'FAQ Bot',
avatar: 'https://i.imgur.com/7k12EPD.png'
},
quickReplies: {
type: 'radio', // or 'checkbox',
keepIt: true,
values: [
{
title: ' Yes',
value: 'yes',
},
{
title: ' Yes, let me show you with a picture!',
value: 'yes_picture',
},
{
title: ' Nope. What?',
value: 'no',
},
],
}
}
]
};
//................
onSend(messages = []) {
this.setState(previousState => ({
messages: GiftedChat.append(previousState.messages, messages)
}));
}
onSend(quickReply = []) {
this.setState(previousState => ({
quickReply: GiftedChat.append(previousState.quickReply, quickReply)
}));
}
/*onSend(suggestions = []) {
this.setState(previousState => ({
messages: GiftedChat.append(previousState.suggestions, suggestions)
}));
}*/
render() {
return (
<View style={{ flex: 1, backgroundColor: '#fff' }}>
<GiftedChat
messages={this.state.messages}
quickReply={this.state.messages.quickReplies}
//messages={this.state.suggestions}
onSend={messages => this.onSend(messages)}
onQuickReply={quickReply => this.onQuickReply(quickReply)}
//onSend2={suggestions => this.onSend2(suggestions)}
user={{
_id: 1
}}
/>
</View>
);
}
}
export default App;
在聊天 UI 中显示为用户消息,我想知道他选择了哪个快速回复,有人帮助我吗?