如何在包含許多物件的陣列中搜索，然后對其進行更新以不顯示重復項

尋求有關如何更新我的陣列 DATA[] 并在表格中正確顯示我的值的幫助。

資料顯示正確，但有重復的對。是否可以找到并替換每對的細節？如果陣列中不存在該對，則添加它。當應用程式運行時，初始回應是所有對和詳細資訊。之后，會發生更新，因此我需要更新詳細資訊而不將其推送到陣列。

function App() {

  const DATA = []
  const [TickerFeed, SetTickerFeed] = useState([]);

    orionUnit.priceFeed.ws.subscribe("allTickers", {
      callback: (tickers) => {

        let keys = zodUtil.util.objectKeys(tickers);
        let values: DATA[] = zodUtil.util.objectValues(tickers);

        //keys is Pair
        //values contains data about the pair
        
        //for every key, push to the DATA array.
        //need to find the pair in DATA[] and set the details from values.pairName

        for (let i = 0; i < keys.length; i  )
        {
          DATA.push({
            Pair: keys[i],
            LastPrice: values[i].lastPrice, 
            Volume: values[i].volume, 
            OpenPrice: values[i].openPrice, 
            LowPrice: values[i].lowPrice, 
            HighPrice: values[i].highPrice })
        }
        SetTickerFeed(DATA);
      }

    } 
     
  );

  return (
  
    <View style={styles.container}>

      <DataTable>
        <DataTable.Header>
          <DataTable.Title>Pair</DataTable.Title>
          <DataTable.Title>LastPrice</DataTable.Title>
          <DataTable.Title>Volume</DataTable.Title>
          <DataTable.Title>OpenPrice</DataTable.Title>
          <DataTable.Title>LowPrice</DataTable.Title>
          <DataTable.Title>HighPrice</DataTable.Title>
        </DataTable.Header>
         
         
         //Currently works but contains duplicates. Once an update from the callback has been received, its just pushed to the array and not updated!!
        {TickerFeed.map((item, index) => (
          <DataTable.Row key={item.Pair}>
            <DataTable.Cell>{item.Pair}</DataTable.Cell>
            <DataTable.Cell numeric>{item.LastPrice}</DataTable.Cell>
            <DataTable.Cell numeric>{item.Volume}</DataTable.Cell>
            <DataTable.Cell numeric>{item.OpenPrice}</DataTable.Cell>
            <DataTable.Cell numeric>{item.LowPrice}</DataTable.Cell>
            <DataTable.Cell numeric>{item.HighPrice}</DataTable.Cell>
          </DataTable.Row>
        ))}

        
        </DataTable>
       
    </View>
  );
}

從回呼內的鍵和值物件顯示的物件，console.log(keys,values)：

uj5u.com熱心網友回復：

我不知道您的資料物件是什么樣的。所以，我假設用這種方式來模擬DATA.

• 如果存在，請更新現有資料。
• 如果沒有，則將該物件添加到DATA.

let DATA = [
  {
    Pair: "FTM-ETH",  // Change this to "BAL-USDT" for simulating the existing object in DATA.
    LastPrice: 0,
    Volume: 0,
    OpenPrice: 0,
    LowPrice: 0,
    HighPrice: 0,
  },
];
let keys = [
  "AVA-USDT",
  "BNB-ORN",
  "BAL-USDT"
];
let values = [
  {
    lastPrice: 1,
    volume: 2,
    openPrice: 3,
    lowPrice: 4,
    highPrice: 5,
  },
  {
    lastPrice: 10,
    volume: 11,
    openPrice: 12,
    lowPrice: 13,
    highPrice: 14,
  },
  {
    lastPrice: 20,
    volume: 21,
    openPrice: 22,
    lowPrice: 23,
    highPrice: 24,
  },
];

for (let i = 0; i < keys.length; i  ) {
  let existingPairInData = DATA.find((pair) => pair.Pair === keys[i]);
  console.log('Existing Pair in DATA :>> ', existingPairInData);

  if (existingPairInData) {
    // Update exist data in array with new data
    existingPairInData.LastPrice = values[i].lastPrice;
    existingPairInData.Volume = values[i].volume;
    existingPairInData.OpenPrice = values[i].openPrice;
    existingPairInData.LowPrice = values[i].lowPrice;
    existingPairInData.HighPrice = values[i].highPrice;
  } else {
    DATA.push({
      Pair: keys[i],
      LastPrice: values[i].lastPrice,
      Volume: values[i].volume,
      OpenPrice: values[i].openPrice,
      LowPrice: values[i].lowPrice,
      HighPrice: values[i].highPrice,
    });
  }
}

console.log('Updated exist object :>> ', DATA);

標籤：javascript 数组 反应式 排序

上一篇：如何將下對角線元素的Numpy陣列轉換為完整矩陣的陣列

下一篇：從mongo檔案中獲取陣列的所有值