<template>
  <div>
    <h1>Console MQTT</h1>
    <div v-for="(message, index) in messages" :key="index">{{ message }}</div>
  </div>
</template>

<script>
import mqtt from 'mqtt';

export default {
  data() {
    return {
      messages: [] // Initialiser un tableau pour stocker les messages MQTT
    };
  },
  created() {
    const client = mqtt.connect('ws://localhost:9001');
    client.on('connect', () => {
    console.log("on connect");
      client.subscribe('#'); // S'abonner à tous les topics MQTT
    });
    client.on('message', (topic, message) => {
    console.log("on message");
      this.messages.push(`Topic: ${topic}, Message: ${message}`); // Ajouter le message à la liste des messages
    });
  }
}
</script>
