react-native-gifted-chat 只重新渲染最后一个气泡

Question

我想在 Bubble 中自定义滴答状态：在 react-native-gifted-chat 中发送、发送、接收和读取

这是我的代码自定义 renderTicks：

    renderTicks = message => {
        const { statusMessage } = this.state;
        // TODO: Status pending
        if (message && message.user && message.user._id === this.ownerInfo?.phone) {
            const status = statusMessage[message._id];
            switch (status) {
                case STATUS_MESSAGE.SENDING:
                    return (
                        <ActivityIndicator
                            size="small"
                            color={Colors.pink_06}
                            style={styles.loadingTick}
                        />
                    );
                case STATUS_MESSAGE.RECEIVED:
                    return (
                        <Icon name={'16_notifications_check_circle_full'} style={styles.ticks} />
                    );
                case STATUS_MESSAGE.SENT:
                    return <Icon name={'16_notifications_check_circle'} style={styles.ticks} />;
                case STATUS_MESSAGE.READ:
                    return (
                        <Avatar
                            size="tiny"
                            name={this.friendInfo?.name}
                            source={{ uri: this.friendInfo?.avatar }}
                            style={styles.ticks}
                        />
                    );
                default:
                    return null;
            }
        } else {
            return null;
        }
    };

状态信息有误

这是我的日志

尽管我设置了 State 状态消息，但气泡并未重新呈现

Answer 1

shouldUpdateMessage 是 react-native-gifted-chat 提供的道具，它帮助我解决了我的问题

shouldUpdateMessage={(props, nextProps) =>
    props.extraData !== nextProps.extraData
}

react-native-gifted-chat 只重新渲染最后一个气泡

react-native-gifted-chat only re-render last bubble

react-native

react-native-gifted-chat