优化提示

Rodney Chen

2024-07-06 e34d8f9133f196f17667d8051a6a9d080b0385fb

 src/views/tigerprojects/test/mqtt/index.vue

@@ -1,7 +1,17 @@
<template>
  <div>
  <div style="margin: auto 10px;">
    <!-- <p></p>
    <p>订阅的主题</p>
    <input type="text">
    <p>发布信息</p>
    <input type="text">
    <button style="color:aquamarine;background-color: brown;" @click="">发送</button>
    &nbsp;
    <div style="background-color:darkgrey;height: 500px; width: 500px;position:relative;left: 260px;top:-110px">

    </div> -->
  </div>

</template>
<script lang="ts">
import { defineComponent, ref, unref } from 'vue';
@@ -12,7 +22,7 @@
  connectTimeout:4000,
  clientId:'mqtt_'+ Math.random().toString(16),
}
client = mqtt.connect('ws://192.168.31.151/mgtt',options)
client = mqtt.connect('ws://broker.emqx.io/mqtt',options)
export default {
  name: 'Helloworld',
  data(){
@@ -27,18 +37,25 @@
    mqttMsg(){
      client.on('connect',(e)=>{
        console.log('连接成功')
        client.subscribe('/test/helloworld',{qos:0},(error)=>{
        client.subscribe('sensor/1/temperature',{qos:0},(error)=>{
          console.log(error)
        })
        client.on("message",(topic,message)=>{
          console.log('收到来自',topic,'的消息',message.tostring())
          console.log('收到来自',topic,'的消息',message.toString())
          if(message.toString()=='hi'){
            client.publish('testtopic/one','hello',{
              qos:0,rein:false
            },(error)=>{
              console.log('error',error)
            })
          }
        })
        client.on("reconnect",(error)=>{
          console.log('正在重连',error)
        })
        client.on("reconnect",(error)=>{
          console.log('连接失败',error)
        })
        // client.on("reconnect",(error)=>{
        //   console.log('正在重连',error)
        // })
        // client.on("reconnect",(error)=>{
        //   console.log('连接失败',error)
        // })
      })
    }
  }