Socket.emit带多个值

时间:2018-10-30 15:21:33

标签: node.js angular express socket.io

每次发射后,将socket.emit内的

socket.emit串联起来。 这是我在服务器端的代码

io.on('connection', function(socket){
let balance = 6000;


console.log('a user connected');

  socket.on('giveValue',function(data){
        if(data.msg==="New Value"){
          let x = Math.floor(Math.random() * 100 - 50);
          balance += x;
          socket.emit('takeValue',{balance:balance,value:x});
        }
  });

  socket.on('disconnect',function(){
      console.log('User disconnected');
  });
  socket.on('getBalance',(data)=>{
    if(data.msg==='bringBalance'){
      socket.emit('ubalance',{data:balance});
    }
  })

});

这是在客户端,对于客户端,我正在使用Angular 6

constructor() {
    this.socket = io('http://localhost:4000');
  }

  ngOnInit() {
    this.socket.emit('getBalance',{msg:"bringBalance"});
    this.socket.on('ubalance',(data)=>{
      console.log(data);
      this.balance=data.data;
    });
  }

  getSum(event) {
    this.socket.open();
    this.socket.emit('giveValue',{msg:"New Value"});
    this.socket.on('takeValue', (data) => {
       this.balance=data.balance;
       console.log("Value====="+data.value) + "\n";
       console.log("Balance======"+data.balance);

    });
  }

每次单击后都会运行getSum()函数,并且在后端生成随机值会将其添加到平衡值,所有这些都在后端进行。 因此,问题在于每次点击后再增加socket.on(“ takeValue”) 同样的价值。我该如何修复此部分。对不起我的语言错误,希望您理解我。感谢您的关注和帮助。

1 个答案:

答案 0 :(得分:2)

您的问题是,您在函数内部声明了.on事件,并且每次运行该函数时,都将新的侦听器设置为takeValue事件。在下面的代码段或类似内容中尝试

constructor() {
    this.socket = io('http://localhost:4000');
}

this.socket.on('ubalance',(data)=>{
    console.log(data);
    this.balance=data.data;
    });

this.socket.on('takeValue', (data) => {
    this.balance=data.balance;
    console.log("Value====="+data.value) + "\n";
    console.log("Balance======"+data.balance);

    });

ngOnInit() {
    this.socket.emit('getBalance',{msg:"bringBalance"});

}

getSum(event) {
    this.socket.open();
    this.socket.emit('giveValue',{msg:"New Value"});

}