最佳答案
我只是自己在做这件事。您需要做的是拥有自定义 renderBubble,在其中用您自己的组件包装。它看起来像这样。代码的第一部分只是将时间戳向左或向右对齐,具体取决于消息是否由当前用户编写。
renderBubble(props) {
var sameUserInPrevMessage = false;
if (props.previousMessage.user !== undefined && props.previousMessage.user) {
props.previousMessage.user._id === props.currentMessage.user._id ? sameUserInPrevMessage = true : sameUserInPrevMessage = false;
}
var messageBelongsToCurrentUser = currentUserId == props.currentMessage.user._id;
return (
<View>
{!sameUserInPrevMessage && <View
style={messageBelongsToCurrentUser ? styles.messageTimeAndNameContainerRight : styles.messageTimeAndNameContainerLeft}
>
<Bubble
{...props}
/>
<Text style={styles.messageTime}>{moment(props.currentMessage.createdAt).format("LT")}</Text>
<Text style={styles.messageUsername}>{props.currentMessage.user.name}</Text>
</View>}
</View>
)
}
也将其放入 GiftedChat 组件中 renderMessage={this.renderBubble}
关于javascript - 如何在气泡聊天 react native 有天赋的聊天下渲染项目时间?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60091882/