TSX React - 如何使用多個 JSON 對象索引 JSON API 數據

Question

我正在嘗試使用useFetch獲取 API 數據和索引以獲取特定值。

這是當前代碼：

const { isLoading, error, data } = useFetch("https://public-api.solscan.io/account/tokens?account=C9XzDbZrZkJ75EvEeb641PQ5Q9kDiN2nFugdyAXqGip1");
  const dataStarsStaked = JSON.stringify(data, ["0", "tokenAddress", "tokenAmount", "uiAmount"], 0);

返回data ：

[{"tokenAddress":"4q5UBXJxE91BZKX548qhU8i5QBWvZdXzS3RZwfTgLQda","tokenAmount":{"uiAmount":253847.899902}},{"tokenAddress":"HCgybxq5Upy8Mccihrp7EsmwwFqYZtrHrsmsKwtGXLgW","tokenAmount":{"uiAmount":6864373.022357}},{"tokenAddress":"HkNK7BL5pSUUzc6ns1mHW5JnzbSG4S9u2QdR3cUuyzSa","tokenAmount":{"uiAmount":678}}]

我正在嘗試獲取 uiAmount of tokenAddress: HCgybxq5Upy8Mccihrp7EsmwwFqYZtrHrsmsKwtGXLgW的值。 我該怎么做呢？ 我不知道如何索引這個。 謝謝！

Answer 1

您可以搜索數據數組：

data.find(x => x.tokenAddress === "HCgybxq5Upy8Mccihrp7EsmwwFqYZtrHrsmsKwtGXLgW");

要消除 typescript 錯誤，您需要定義類型（使用與此類似的內容，但將any[]更改為 api 返回的 object 類型的數組）：

interface YourFetchResult {
   data: any[];
   isLoading: boolean;
   error?: string;
}

const { isLoading, error, data }: FetchResult = useFetch(...)

Answer 2

您需要應用 for 循環並具有檢測字符串的條件，請參見下文

  let x  = [{"tokenAddress":"4q5UBXJxE91BZKX548qhU8i5QBWvZdXzS3RZwfTgLQda","tokenAmount":{"uiAmount":253847.899902}},{"tokenAddress":"HCgybxq5Upy8Mccihrp7EsmwwFqYZtrHrsmsKwtGXLgW","tokenAmount":{"uiAmount":6864373.022357}},{"tokenAddress":"HkNK7BL5pSUUzc6ns1mHW5JnzbSG4S9u2QdR3cUuyzSa","tokenAmount":{"uiAmount":678}}]
  
  for (let i = 0; i < x.length; i++) {
    if(x[i].tokenAddress==="HCgybxq5Upy8Mccihrp7EsmwwFqYZtrHrsmsKwtGXLgW") {
      console.log(x[i].tokenAmount)
    }
  
  }