【问题标题】:How could I update message from difference socket.io event?如何从不同的 socket.io 事件中更新消息?
【发布时间】:2020-01-24 02:10:07
【问题描述】:

我正在使用具有不同事件channelName1channelName2的api

//...this the realtime record
socket.on(channelName1, message => {
      console.log(channelName1, message1);
      //this return single item list in realtime`[{"price":100,"size":0.001}]`
 });

//realtime snapshot collection of records
socket.on(channelName2, message => {
   console.log(channelName2, message2);
   //this return the collection `[{"price":100,"size":0.01}, {"price":200,"size":0.02} ]`
   $('#live').text(message2)
});

如果我发现price":100 存在于集合message2 中,我想更新message2 的大小,因此更新后的message2 将

[{"price":100,"size":0.001}, {"price":200,"size":0.002} ]

谁能指导我如何从 channelName1 更新到 ChannelName2 数据?

【问题讨论】:

  • 您的问题有点不清楚,如果您需要一个函数/回调变量/导致另一个函数,请创建一个两者都可以访问的变量。即创建一个名为 realtime 的变量,然后使用循环检查 channelName2 -> item.price == realtime.price -> push(item) etc
  • 你能帮忙提供一些示例代码吗
  • 我想通过 message1 中的 'size' 更新 message1 中的 'size' 价格为 100

标签: javascript jquery socket.io


【解决方案1】:

您必须将单件物品存放在某处,并且当收藏品到达时您需要:

  1. 使用map 处理集合中的每个项目。
  2. 对于每一项,在存储的单项中尝试find它。
  3. 如果找到,请更改大小。

我还在集合中包含了一条无法找到的记录,因此您可以看到那里发生了什么:它保持不变。

忽略我为模拟套接字所做的小改动。希望你能看到我正在做的事情的大局。

希望这对编码有所帮助。

// Stores each single item that arrives.
let singleItems = [];

// ...this is the realtime record.
function socketOn1(channelName1, message1) {
  console.log(channelName1, message1);

  // Store each single item as it arrives.
  singleItems.push(message1[0]);
};

// realtime snapshot collection of records
function socketOn2(channelName2, message2) {
  console.log(channelName2, message2);

  // For each element in the collection, find
  // the same record in the single items and
  // if found, update the price.
  results = message2.map((elem) => {
    found = singleItems.find(
      (single) => single.price === elem.price
    )
    if (found) {
      elem.size = found.size
    }
    return elem
  })

  console.log('results:')
  console.log(results)
};


// This stuff just simulates stuff arriving to sockets.
// You can ignore it if you want. But look at the order
// in which they are called.

let singleItemsMock = [{
    "price": 100,
    "size": 0.01
  },
  {
    "price": 50,
    "size": 0.02
  },
  {
    "price": 25,
    "size": 0.03
  },
  {
    "price": 10,
    "size": 0.04
  }
]

let collectionMock = [{
    "price": 100,
    "size": 0.001
  },
  {
    "price": 50,
    "size": 0.002
  },
  {
    "price": 13,
    "size": 0.005
  }
]

socketOn1(null, [singleItemsMock[0]])
socketOn1(null, [singleItemsMock[1]])
socketOn1(null, [singleItemsMock[2]])
socketOn1(null, [singleItemsMock[3]])

socketOn2(null, collectionMock)

【讨论】:

    【解决方案2】:

    您可以将channel1的数据存储在hashMap中,并循环channel2的数据以检查hashmap中是否有条目并根据该条目返回项目。

    const channel1HashMap = {};
    
    //...this the realtime record
    socket.on(channelName1, message => {
       console.log(channelName1, message1);
       dataHandler(message1, null);
    });
    
    //realtime snapshot collection of records
    socket.on(channelName2, message => {
       console.log(channelName2, message2);
       const data = dataHandler(null, message2);
       updateView(data);
    });
    
    dataHandler = (message1, message2) => {
      const channel2Data = [];
      if(Array.isArray(message1)) {
        message1.forEach((message)=> {
           channel1HashMap[message.price] = message;
        });
      } else if(Array.isArray(message2)) {
        message2.forEach((message)=> {
          if(Object.prototype.hasOwnProperty.call(channel1HashMap, message.price)){
            channel2Data.push(channel1HashMap[message.price]);
          } else {
            channel2Data.push(message);
          }
        });
      }
      return channel2Data;
    }
    
    updateView = (data) => {
      $('#live').text(data)
    }
    
    

    【讨论】:

      【解决方案3】:
      socket.on(channelName1, message => {
        console.log(channelName1, message1);
        //this return single item list in realtime`[{"price":100,"size":0.001}]`
        var t = $('#live').text(message2)
        var text = JSON.parse(t)
        text[1].price = message[0].price
        $('#live').text(JSON.stringify(text))
        });
      

      【讨论】:

        【解决方案4】:

        这是一个将 websocket 有效负载保存到在更“全局”范围内创建的对象的问题。

        // since these are defined outside of the websocket event handlers
        // they are available to each
        var payload1 = [];
        var payload2 = [];
        
        const combinePayloads = () => {
            if (payload1[0].price === payload2[0].price) {
                // merge values if prices are the same
                let combinedArray = payload1.concat(payload2);
                console.log(combinedArray);
            }
        };
        
        socket.on(channelName1, message => {
            payload1 = message;
            combinePayloads();
        });
        socket.on(channelName2, message => {
            payload2 = message;
            combinePayloads();
        });
        

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 2015-09-07
          • 2013-10-10
          • 2018-09-23
          • 1970-01-01
          • 1970-01-01
          • 2021-12-25
          • 2021-02-14
          • 1970-01-01
          相关资源
          最近更新 更多