將數據從 socket.io 推送到數組中

Question

我有以下問題，我似乎無法解決。 我試圖從我的 socket.io 發射器中獲取一個數組數組，其結構如下：

[ [{...},{...},{...}] , [{...},{...}] , [{...}] ]

相反，我得到了這個：

我需要一個主陣列中的所有陣列，以便我可以為每個子陣列渲染引導卡。

客戶端代碼：

const socket = io("http://localhost:5000");

    socket.on('data', (dta) => {
        handleData(dta.data);  
    })

    function handleData(data) {
      const masterArray= [];
        masterArray.push(data);  
        console.log(masterArray);   
    }

服務器端代碼：

for(let i = 0 ; i < alarmpanels.length ; i++) {
const ElkClient = elkClient.ElkClient;
    let client = new ElkClient({
        connection: {
          name: alarmpanels[i].name,
          host: alarmpanels[i].host,
          port: alarmpanels[i].port,
          secure: alarmpanels[i].secure,
          zones: alarmpanels[i].zones
     }
  });

  connectClient(client);
}

  async function connectClient(client) {
    await client.connect();
    const zonesArray = client.options.connection.zones;
    const arr = [];
      try {
        const clhost = client.options.connection.host;
        const clport = client.options.connection.port;
        const clsecure = client.options.connection.secure;
        let data = await client.getArmingStatus();
        for (i = 0 ; i < zonesArray.length ; i ++) {
        const armUpState = await data.areas[i].armUpState;
        const clName = client.options.connection.name;
        const zoneName = zonesArray[i].name;
        const siteName = zonesArray[i].site;
        const clzone = zonesArray[i].zone;
        const totalPanels = zonesArray[i].length;

        const info = new PanelStatus(clhost, clport ,clsecure, clzone, siteName, clName, zoneName, armUpState, totalPanels);
        arr.push(info);
        }


      io.on('connection', (socket, req) => {
          socket.emit('data', {data: arr});
        })

      }
      catch (err) {
        console.log("Connection Lost!");
      }

    }

Answer 1

您的客戶端代碼需要稍作更改
1) 將 masterArray 聲明保留在 handleData 之外
2) 推送到 masterArray 時，使用... spread 運算符。

 const masterArray = []; /* const socket = io("http://localhost:5000"); socket.on("data", dta => { handleData(dta.data); }); */ function handleData(data) { masterArray.push(...data); } handleData([{ a: 4 }, { b: 5 }]); handleData([{ z: 4 }]); handleData([{ p: 4 }, { q: 5 }, { r: 5 }]); console.log(masterArray);

Answer 2

如果可以使用 es2020，則可以使用 Array.flat()

 let startingArray = [ [{ entry1: 1, entry2: 2, entry3: 3 }, { entry4: 4, entry5: 5, entry6: 6 }, { entry7: 7, entry8: 8, entry9: 9 }], [{ entry10: 10, entry11: 11, entry12: 12 }, { entry13: 13, entry14: 14, entry15: 15 }], [{ entry16: 16, entry17: 17, entry18: 18 }] ] const flattened = startingArray.flat() console.log('startingArray', startingArray) console.log('flattened', flattened)