How to Store an Emmiter.io received messages in a Variable and send as props

Question

How can I store Message packets received from Emitter.io in a variable and send them as prop to a child component in Vue.js?

Here is the package reference website: https://emitter.io/develop/javascript/

 data() {
      return {
        channel_data: null,
        messages: null,
        channel_loading: false,
        is_message_loading: false,
        emitter: null,
      };
    },
    async mounted() {
      this.emitter = require("emitter-io").connect();
      await this.getAllInboxMessages();
    },
    methods: {
      sendMessage(emit_message) {
        this.emitter.publish({
          key: "C0mj7xc3Hhqz5VRyaajkvbrjbvsjvkdbjakN",
          channel: "S1VLWnpMMWtXZBHJLBHjlhjlvVbhjlz9",
          ttl: 10080,
          message: JSON.stringify(emit_message),
        });
      },
      // Get all channel members details
      async getChannelDetails() {
        this.channel_loading = true;
        let response = await Messages.getChannelDetails();
        return response;
      },
      async getAllInboxMessages() {
        this.is_message_loading = true;
        this.channel_data = await this.getChannelDetails();
        await this.getCompleteChat(this.channel_data[0]);
      },
      // Open complete conversation
      async getCompleteChat(channel_data) {
        this.messages = await Messages.getAllMessages(channel_data);
        this.getEmitterMessages();
      },
      getEmitterMessages() {
        this.emitter.subscribe({
          key: "C0mj7xc3Hhqz5VRyaajkvbrjbvsjvkdbjakN",
          channel: "S1VLWnpMMWtXZBHJLBHjlhjlvVbhjlz9",
          last: 100,
        });
        this.emitter.on("message", function (msg) {
          console.log("message", msg.asString());
          if (msg.asString().includes("sender")) {
            this.messages.push(JSON.parse(msg.asString()));
          }
        });
        setTimeout(() => {
          this.is_message_loading = false;
        }, 2000);
      },
    },

When I am trying to push the message in a data property variable I am getting this error:

Uncaught TypeError: Cannot read properties of undefined (reading 'messages')
    at eval (Home.vue?76f2:187:1)
    at eval (emitter.js?5420:257:1)
    at Array.forEach (<anonymous>)
    at Emitter._tryInvoke (emitter.js?5420:257:1)
    at MqttClient.eval (emitter.js?5420:57:1)
    at MqttClient.emit (events.js?7e25:153:1)
    at MqttClient._handlePublish (client.js?df86:770:1)
    at MqttClient._handlePacket (client.js?df86:277:1)
    at process (client.js?df86:233:1)
    at writable._write (client.js?df86:243:1)