反应-本地-天才-聊天显示相同的信息多次。

Question

我在我的反应本地应用程序中使用react-native-gifted-chat。正如我在这图片中所显示的那样，同一条消息多次显示，message: Yes getting new msg的位置也与它的实际位置不同。我的问题与这一样。有人能帮我解决这个问题吗？

提前谢谢你。

Answer 1

背后可能有两个原因，

1)每条消息都应该传递一个唯一的id，所以只需使用uuidv4 npm包并将其附加到对象的_id支柱中即可。

示例：

messages: GiftedChat.append(previousState.messages, {
              _id: uuidv4(), // or use  Math.round(Math.random() * 1000000)
              text: text,
              createdAt: new Date(),
              user: {
                _id: 2,
                name: "React Native",
                avatar: "https://placeimg.com/140/140/any"
              },
              image: attachment
            })

2)第二种可能是在网关上启动用户之间的聊天。因此，一些网关已经知道了多次重复消息的问题。您可以在每次收到新消息并将其推送到聊天屏幕时进行字符串比较，但是不建议这样做。

Answer 2

我找到了我的问题的答案。罗恩，你说得对，但就我而言，问题就不一样了。我通过改变参数的格式来解决这个问题。它采取了不同的形式，我通过了不同的，所以他们互相冲突。以下是可能对其他人有用的解决方案。

parse = snapshot => {
    const { timestamp: numberStamp, text } = snapshot.val();
    const { key: _id } = snapshot;
    const createdAt = moment(snapshot.val().createdAt, "DD/MM/YYYY hh:mm:ss");

     const user = { };
     var temp_data = snapshot.val()
     if(snapshot.val().name == this.state.temp_logged_name) {
         user._id = 1; 
         user.name = temp_data.name;
         user.avatar = temp_data.avatar;
     }
     const message = {
        _id,
        createdAt,
        text,
        user,
     };
     return message;
};

Answer 3

我也遇到过这个问题。我在我的移动应用程序上安装了react-native-gifted-chat。在另一端，我用脚本设置了一个简单的HTML页面，用于初始化Websocket连接并在onsend事件上发送消息。后来我意识到，当唯一的id在应用程序端生成时(因为id是由库本身生成的)，而另一端则不存在这种类型的id。

基本上，当一条消息缺少一个唯一的id _id时，这种奇怪的行为就会出现。在执行时，每个消息必须至少具有以下属性。

      {
        _id: 1,
        text: 'Hello developer',
        createdAt: new Date(),
        user: {
          _id: 2
        }
      }