Vue.js данные не обновляются при получении сообщения из сокета

Я пытаюсь спроектировать vue.js приложение, которое обновляет данные о состоянии игры при получении сообщения "new_state" из сокета. Сокет реализован с использованием каналов django.

Вот как выглядит этот код:

const ws_scheme = window.location.protocol == "https:" ? "wss" : "ws"

const gameSocket = new WebSocket(
    ws_scheme +
    '://'
    + window.location.host
    + '/ws/play/'
    + game_id
    + '/'
)
    let vue = new Vue({
        el: '#app',

        data: {
            current_turn: 0,
            last_turn: -1,
            current_card: 0,
            last_card: -1,
            number_of_stacked_cards: 0,
            last_amount_played: 0,
            won_by: -1,
            my_cards: [],
            other_players_data: {},
        },

        created() {
            gameSocket.onmessage = function(e) {
                data = JSON.parse(e.data)
                this.current_turn = data.state.current_turn
                this.last_turn = data.state.last_turn
               // ... update the other data
            };
        },
    });

Когда я получаю сообщение, протоколирование данных делает очевидным, что я получаю правильную информацию. Однако, если я иду и набираю vue.current_turn после получения сообщения, это все равно 0 вместо нового значения; то же самое для всех других членов объекта data. Я попробовал с vue.current_turn = data.state.current_turn, и он действительно работает таким образом, но, очевидно, он должен работать с this.

Что не так с моим кодом?

И вообще, каков наилучший способ выполнить то, что мне нужно, то есть обновить внутренние переменные данных при получении сообщений из сокета?

Мне приходится обходиться без использования розетки.библиотека ввода-вывода, которая не поддерживается каналами.