如何在聊天左侧显示消息

问题描述

我正在尝试建立一个聊天页面，以便用户可以与我已经创建的聊天机器人进行交互。用户消息会在页面右侧弹出，但是当消息发送到服务器并返回响应时，我不确定如何在左侧显示消息。

const [messages,setMessages] = useState([
    {
      _id: 0,text: 'Hello! How may I assist you?',createdAt: new Date().getTime(),user: {
        _id: 2,name: 'System',avatar: require('./assets/splash.png')
      }
    },{
      _id: 1,text: 'New chat started.',system: true
    }
    
  ]);

  function systemResponse(answer){
    <GiftedChat
    
    />
  }
function handleSend(newMessage = []){

    setMessages(GiftedChat.append(messages,newMessage));
    console.log(newMessage);

    var userText = newMessage[0].text;
    console.log(userText);

    fetch('http://ec2-3-23-33-73.us-east-2.compute.amazonaws.com:5000/chatbot',{
      method: 'POST',body: JSON.stringify({
        textString: userText,})
  })
  .then((response) => response.json())
  .then((json) => {<GiftedChat
  user={{_id: 2,name:"System",avatar: require('./assets/splash.png')}}
  text = 'hello' 
  />})
 
}

  return(
    <GiftedChat
    onSend={newMessage => handleSend(newMessage)}
    messages={messages}
    user={{ _id: 1,name: 'Luke' }}
    placeholder="Ask your quesiton here..."
    showUserAvatar
    alwaysShowSend
    scrollToBottom
    />
  );

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）