除非JSON在陣列中，否則Blazorwebassembly外部api不起作用

我剛開始使用 Blazor，我正在嘗試進行與啟動器 WeatherForcast API 呼叫非常相似的外部 API 呼叫。但是，不同之處在于外部 API 呼叫沒有將 JSON 物件包裝在陣列中。我只是想知道我需要改變什么才能讓它作業。我確實確認我是否將它包裝在一個有效的陣列中。我將 api 結果復制到示例 weather.json 中，結果相同。

@page "/"
@inject HttpClient Http

<h1>Pokemon</h1>

<p></p>

@if (pokemons == null)
{
    <p><em>Loading...</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>Name</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var pokemon in pokemons)
            {
            @foreach (var n in pokemon.results)
                    {
                        <tr>
                            <td>@n.name</td>
                        </tr>
                    }
            }
        </tbody>
    </table>
}

@code {
    private PokemonList[] pokemons;

    protected override async Task OnInitializedAsync()
    {
        pokemons = await Http.GetFromJsonAsync<PokemonList[]>("sample-data/weather.json");
    }



    public class PokemonDetails
    {
        public string name { get; set; }
        public string url { get; set; }
    }


    public class PokemonList
    {
        public int count { get; set; }
        public string next { get; set; }
        public List<PokemonDetails> results { get; set; }
    }
}

天氣.json

  {
    "count": 1126,
    "next": "https://pokeapi.co/api/v2/pokemon/?offset=20&limit=20",
    "previous": null,
    "results": [
      {
        "name": "bulbasaur",
        "url": "https://pokeapi.co/api/v2/pokemon/1/"
      },
      {
        "name": "ivysaur",
        "url": "https://pokeapi.co/api/v2/pokemon/2/"
      },
      {
        "name": "venusaur",
        "url": "https://pokeapi.co/api/v2/pokemon/3/"
      },
      {
        "name": "charmander",
        "url": "https://pokeapi.co/api/v2/pokemon/4/"
      },
      {
        "name": "charmeleon",
        "url": "https://pokeapi.co/api/v2/pokemon/5/"
      },
      {
        "name": "charizard",
        "url": "https://pokeapi.co/api/v2/pokemon/6/"
      },
      {
        "name": "squirtle",
        "url": "https://pokeapi.co/api/v2/pokemon/7/"
      },
      {
        "name": "wartortle",
        "url": "https://pokeapi.co/api/v2/pokemon/8/"
      },
      {
        "name": "blastoise",
        "url": "https://pokeapi.co/api/v2/pokemon/9/"
      },
      {
        "name": "caterpie",
        "url": "https://pokeapi.co/api/v2/pokemon/10/"
      },
      {
        "name": "metapod",
        "url": "https://pokeapi.co/api/v2/pokemon/11/"
      },
      {
        "name": "butterfree",
        "url": "https://pokeapi.co/api/v2/pokemon/12/"
      },
      {
        "name": "weedle",
        "url": "https://pokeapi.co/api/v2/pokemon/13/"
      },
      {
        "name": "kakuna",
        "url": "https://pokeapi.co/api/v2/pokemon/14/"
      },
      {
        "name": "beedrill",
        "url": "https://pokeapi.co/api/v2/pokemon/15/"
      },
      {
        "name": "pidgey",
        "url": "https://pokeapi.co/api/v2/pokemon/16/"
      },
      {
        "name": "pidgeotto",
        "url": "https://pokeapi.co/api/v2/pokemon/17/"
      },
      {
        "name": "pidgeot",
        "url": "https://pokeapi.co/api/v2/pokemon/18/"
      },
      {
        "name": "rattata",
        "url": "https://pokeapi.co/api/v2/pokemon/19/"
      },
      {
        "name": "raticate",
        "url": "https://pokeapi.co/api/v2/pokemon/20/"
      }
    ]
  }

如果將整個 json 包裝在一個陣列中，則它可以作業，否則我會收到以下錯誤：

uj5u.com熱心網友回復：

你要求解碼一組 PokemonLists

 pokemons = await Http.GetFromJsonAsync<PokemonList[]>("sample-data/weather.json");

但那里沒有陣列。只是一個 PokeMonList 中的一個陣列。做

pokemons = await Http.GetFromJsonAsync<PokemonList>("sample-data/weather.json");

和

    <tbody>
        @foreach (var n in pokemons.results)
        {
                    <tr>
                        <td>@n.name</td>
                    </tr>
         }
        
    </tbody>

標籤：C＃ json 西装外套 blazor-webassembly

上一篇：如何將JSON檔案決議為name:value？

下一篇：嘗試解碼來自CURL請求的json回應時出錯