如何在本机消息传递应用程序中的群聊消息中显示发件人姓名，如果他发送的下一则消息不显示其姓名？

Question

我具有本机消息传递应用程序，它包含组消息传递。现在我想在特定消息上显示发件人的姓名。我已经在邮件中显示了发件人的姓名。但是我想做的是当连续有多条消息时，只在第一条消息上显示他的名字。

这是屏幕截图。

看起来在第一张图像的所有消息上都显示了名称。

现在想这样做，所以只在第一条消息中显示他的名字。

在我以前用来显示名字的列表中，就像这样，

`<Text numberOfLines={1} style={{
                              flexDirection: 'row',alignItems:'center',textAlignVertical:'center',
                              flexWrap: 'wrap', color: 'rgb(44,88,157)', fontWeight: '600',
                              paddingLeft: 0,
                              justifyContent: 'flex-start',
                            }}
                            >{item.sender_user_id.nick_name
                              }</Text>`

Answer 1

您只需要一个局部变量来跟踪上一条消息的发件人，并在遍历这些消息时更新该变量。

renderMessage(showName = true, name, body) {
    return <Message showName={showName} name={name} body={body}/>
}

renderMessages(messages) {
    let lastSenderId = undefined;

    messages.map(message => {
        let showName = !lastSenderId || message.senderId !== lastSenderId;
        lastSenderId = message.senderId;
        renderMessage(showName, message.name, message.body)
    });
}