Как в чате расспознать конкретное сообщение и произвести по нему изменения vue.js socket.io

Подскажите пожалуйста пару моментов, я сейчас пишу чат на vue.js так же используется socket.io, стоит задача удалять и изменять сообщения. Сообщения хранятся в массиве messages. Отправка сообщения выполняется в методе sendMessage, где формируется пост запрос с параметрами для сохранения в которых есть одно поле uniq_id это уникальная строка, чтобы позже когда придется ответ от бродкастера расспознать в массиве это сообщение.

Пока сообщение отправляется и ожидается ответ я добавляю в массив messages новое сообщение данные которые мне не известны я заполняю null'ом. Получается так, что по нажатию энтера сообщение сразу появляется у пользователя на экране.

Когда пришел ответ от бродкастера я ищу это сообщение в массиве messages перезаписываю его, но вот тут как раз и вся суть проблемы, верстка уже отрендерена можно как-то новый данные массива синхронизировать с версткой, чтобы ко клику в метод editMessage(message) прилетал message актуальный который уже перезаписал в массиве messages?

<div class="chat-room__body">
    <div class="chat-room__content">
        <div class="chat-room__messages" ref="messages">

            <div v-for="message in messages" class="chat-room__message" :class="message.class" >
                <div class="chat-room__message-data">
                    <div class="chat-room__message-author" v-if="message.class === 'ltr'">{{ message.user.name + ' ' + message.user.surname}}</div>
                    <div class="chat-room__message-date">{{ message.date }}</div>
                </div>
                <div class="chat-room__message-text" @click="editMessage(message)">{{ message.message }}</div>
            </div>

        </div>
    </div>
    <div class="chat-room__controls">
        <div class="chat-room__message-content">
            <input id="message-content" @keyup.enter="sendMessage" v-model="textMessage">
            <img width="30" src="/images/chat/send.svg" alt="send icon" class="chat-room__send">
        </div>
    </div>
</div>



<script>
export default {
    data() {
        return{
            messages: [],
            textMessage: '',
            isSender: false,
            chats: [],
            currentUser: {},
            currentChat: {},
            link: null
        }
    },
    props: ['chat_id', 'current_user', 'current_chat'],
    mounted() {
        this.currentUser = JSON.parse(String(this.current_user))
        this.currentChat = JSON.parse(String(this.current_chat))

        if (this.currentChat.lot_id) {
            this.link = '/lot/' + this.currentChat.id;
        }

        window.Echo.private('chat.' + this.chat_id).listen('PrivateChatEvent', ({data}) => {
            if (data.uniq_id) {
                this.changeMessage(data)
            } else {
                this.messages.push(data);
                setTimeout(() => { this.scrollChatContent() }, 10);
            }
        });    

        this.getUserChats();
        this.getUserChatMessages()

    },
    methods: {
        scrollChatContent(){
            let chatContent = this.$refs.messages;
            chatContent.scrollTop = chatContent.scrollHeight;
        },
        sendMessage(){
            setTimeout(() => { this.scrollChatContent() })
            if (this.textMessage.length === 0) return;
            let uniq_id = this.generateUniqueId();

            axios.post('/panel/messages/send', {
                message: this.textMessage,
                chat_id: this.chat_id,
                uniq_id })
                .catch((error) => {
                    if (error.response.status === 429) {
                        warningMessage({
                            warning: {
                                message: 'Слишком много запросов, пожалуйста, подождите немного'
                            }
                        })
                    } else if (error.response) {
                        warningMessage({
                            warning: {
                                message: error.response.statusText
                            }
                        })
                    }
                })
            this.messages.push({
                uniq_id: uniq_id,
                id: null,
                chat_id: null,
                is_read: 0,
                message: this.textMessage,
                user: null,
                class: 'rtl',
                date: null,
                updated_at: null,
                created_at: null,
            });
            this.textMessage = '';
        },

        editMessage(message){
            console.log(message)
        },
        changeMessage(data){
            for (let i in this.messages) {
                if (this.messages[i].uniq_id && this.messages[i].uniq_id === data.uniq_id) {
                    this.messages[i] = data;
                }
            }

            console.log(this.messages)
        }
    }
}
</script>