vue如何渲染websocket数据

vue如何再页面渲染websocket请求得到的数据

data(){
    return:{
        marketTrades:[],
    }
},
mounted(){
    this.someThing();
},
methods:{
    someThing(){
        const websocketId = String(this.optionValue);
        const ws = new WebSocket("ws://192.168.8.8888:8888/message");
        
        ws.onopen = function () {
           const  from={"req":"sub","channel":"market.all","market":websocketId}
           ws.send(JSON.stringify(from));
        };
        
        ws.onmessage = function (evt) {
              const result= evt.data;
              const data = JSON.parse(event.data)
              
            this.marketTrades = data.data['market.trades'];//实时成交数据
              
            console.log(this.marketTrades);//实时成交数据,这里能正确返回需要的数据
        };
    }
    
}

在websocket里面能正确打印出‘实时成交数据’,但是要把数据渲染到界面中的时候,这个this.marketTrades是空。
我在网上查过,说是数据的作用域不同,但是还是找不到解决方法

请问下这种应该怎么去正确渲染呢

阅读 5k
2 个回答
something(){
    var self = this
    
    onmessage =function(){
      self.marketTrades =....
    }
}

也可以用es6箭头函数

ws.onmessage = (evt) => {
    console.log(this.marketTrades);
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题