在天才聊天中删除和复制消息答案

【问题标题】：Delete and copy mesage in gifted chat在天才聊天中删除和复制消息
【发布时间】：2019-12-11 11:01:11
【问题描述】：

使用 Dialogflow，我有 onLongPress 到 GiftedChat 组件，如下所示：

 <GiftedChat
   onLongPress={this.onLongPress}

   ....
   ....
/>

onLongPress 返回上下文，消息。然后您可以显示一个 ActionSheet 并添加删除和复制的逻辑。

onLongPress(context, message) {
    console.log(context, message);
    const options = ['copy', 'Delete Message', 'Cancel'];
    const cancelButtonIndex = options.length - 1;
    context.actionSheet().showActionSheetWithOptions({
        options,
        cancelButtonIndex
    }, (buttonIndex) => {
        switch (buttonIndex) {
            case 0:
                Clipboard.setString(this.props.currentMessage.text); this code not work and brakes my app :(
                break;
            case 1:
               //code to delete
                break;
        }
    });
}

这里我有代码的发送属性：

  sendBotResponse(text) {
let msg = {
  _id: this.state.messages.length + 1,
  text,
  //createdAt: new Date(Date.UTC(2019, 5, 11, 17, 20, 0)),
  createdAt: new Date(),
  user: BOT_USER,
};
this.setState(previousState => ({
  messages: GiftedChat.append(previousState.messages, [msg]),
 }));
}

handleGoogleResponse(result) {
  console.log(result);
  let text = result.queryResult.fulfillmentMessages[0].text.text[0];
  this.sendBotResponse(text);
}

onSend(messages = []) {
   this.setState(previousState => ({
    messages: GiftedChat.append(previousState.messages, messages),
 }));
 let message = messages[0].text;
 Dialogflow_V2.requestQuery(
    message,
    result => this.handleGoogleResponse(result),
    error => console.log(error)
  );
}

我犯了一个非常愚蠢的错误，这仅适用于箭头函数，除非您手动将其绑定到普通函数，因此必须在 onLongPress 中使用箭头函数

【问题讨论】：

标签： react-native dialogflow-es react-native-gifted-chat

【解决方案1】：

更改this.props.currentMessage.text
致messages.text
创建以下函数：

    onDelete(messageIdToDelete) {
    this.setState(previousState =>
      ({ messages: previousState.messages.filter(message => message.id !== messageIdToDelete) }))
    }

    onLongPress(context, message) {
    console.log(context, message);
    const options = ['copy','Delete Message', 'Cancel'];
    const cancelButtonIndex = options.length - 1;
    context.actionSheet().showActionSheetWithOptions({
        options,
        cancelButtonIndex
    }, (buttonIndex) => {
        switch (buttonIndex) {
            case 0:
                Clipboard.setString(message.text);
                break;
            case 1:
                this.onDelete(messageIdToDelete) //pass the function here
                break;
        }
    });
}

【讨论】：

您好，谢谢您的帮助！！知道如何执行删除消息的逻辑吗？
你想从屏幕上删除消息还是从后端服务器删除消息我假设你有一个后端服务器设置来将消息保存在某个数据库中
只是用户的屏幕
onDelete(messageIdToDelete) { this.setState(previousState => ({ messages: previousState.messages.filter(message => message.id !== messageIdToDelete) })) }
创建此函数并将其作为case 1: this.onDelete(messageIdToDelete)传递

【解决方案2】：

请改变调用函数的方式

onLongPress={this.onLongPress} 到 onLongPress={() => { this.onLongPress() }}

【讨论】：

嗨，谢谢你的帮助，但是当我把代码改成这个时，代码就坏了……还有其他想法吗？