在vue中使用WebSocket、stompjs实时接收消息

背景是这样的公司车间需要电子看板想使用stompjs消息队列发送数据，而我就是在vue中接收数据，核心代码如下：

var app = new Vue({
   el: "#main",
   data: {
       client: Stomp.over(new WebSocket('ws://1.1.1.1:1000/ws')),
       
   },
   created() {
       this.connect();
   },

   methods: {
		//连接client
       connect(){
           var _that = this;
           this.client.debug = null;
           this.client.connect('账号', '密码', this.onConnected, this.onFailed, '/');
       },
       //连接后订阅指定名称的消息队列
       onConnected(msg){
           var topic = '/queue/queues';
           this.client.subscribe(topic, this.responseCallback, this.onFailed) 
       },
       //连接失败或订阅失败返回的数据
       onFailed(msg){
           console.log('error' + msg);
       },
       //接收到的数据msg.body
       responseCallback(msg){
           let responseMsg  = msg.body;
       }
   }
})

这个测试页面引用vue.js、stomp.js即可。
可以自己测试send几条数据试一下是否连接成功并且可以顺利的接收到send的数据。