为什么来自 firestore 的聊天消息显示在“组”中？

问题描述

我正在尝试使用 react-native-gifted-chat 在我的应用中构建聊天室。

不幸的是，聊天出现在“组”中，而不是按顺序出现。例如，

1. 我发送消息
2. 其他人发送消息
3. 我再发一条消息
4. 我发送的消息组合在一起，有时出现在其他消息上方，有时出现在下方

这是问题的图片：

注意一些较年轻的消息是如何在一些较旧的消息之上的，并且按发送它的用户分组！

这是我将消息写入数据库的方式：

onSend = async(message) => {
        this.setState({isTyping: true})
        await Firebase.firestore().collection("chat")
        .add({
            user: {
                _id: this.state.currentUser.id,name: this.state.currentUser.name,avatar: this.state.currentUser.avatar,},})
        .then(ref => this.setState({messageID: ref.id}))

        await Firebase.firestore().collection("chat")
        .doc(this.state.messageID)
        .set({
            _id: this.state.messageID,text: message[0].text,createdAt: dayjs(Moment(message[0].createdAt).format('LLL')).locale('en-ca').format()
        },{ merge: true })

    }

    render() { 
        return (
            <View style={{backgroundColor: '#000000',flex: 1}}>
                <GiftedChat
                    showUserAvatar={true}
                    isTyping={this.state.isTyping}
                    renderUsernameOnMessage={true}
                    messages={this.state.messages}
                    onSend={message => this.onSend(message)}
                    scrollToBottom
                    locale = { dayjs.locale('en-ca') }
                    showAvatarForEveryMessage = {true}
                    dateFormat = 'll'
                    timeFormat = 'LT'
                    onPressAvatar={user => this.getProfile(user)}
                />
            </View>
            
        )
        
    }
}

我如何阅读消息：

getCurrentMessages = async() => {

        await Firebase.firestore().collection("chat")
        .orderBy("createdAt","desc")
        .limit(50)
        .onSnapshot(querySnapshot => {
            const messages = []

            querySnapshot.forEach((res) => {
                const { 
                    _id,user,text,createdAt,} = res.data();
    
                    messages.push({
                        key: res._id,_id,});
            })

            this.setState({
                messages,isLoading: false,isTyping: false
            });
        })
    }

在 firestore 中，时间是这样写入数据库的：

知道为什么消息被分组在一起吗？

这似乎是从按创建日期排序的 firestore 中提取消息的简单案例，但这看起来并不正常。

我在天才聊天中发送消息时也出现以下错误，这可能与此有关吗？

react-native-gifted-chat] GiftedChat: `user` is missing for message {"_id":"lxYBMTV0sD7kaLQOsQLp","text":"Test 5","createdAt":"2021-01-25T22:05:00-08:00"}

[有些消息是从东海岸发送的，有些是从美国西海岸发送的。我想知道这是否与分组有关？]

解决方法

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

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

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