如何在 .NET MAUI 中發送和顯示獲取請求？

Question

我正在嘗試使用 .NET MAUI 實現一個小型應用程序，但我在運行時不斷出錯

System.Net.WebException：'無法解析主機“reqres.in”：沒有與主機名關聯的地址'

有時我會收到聽起來像這樣的錯誤：

System.InvalidCastException：“指定的演員表無效。”

為了顯示響應，我使用了 ListView 控件，最后是 CollectionView

我使用 Nuget Package 管理器安裝了 Newtonsoft.Json。

代碼隱藏文件包含以下代碼：

private const string url = "https://reqres.in/api/users";
private HttpClient _Client = new HttpClient();
private ObservableCollection<User> userCollection;

    protected override async void OnAppearing()
    {
        
        base.OnAppearing();

        var httpResponse = await _Client.GetAsync(url);

        if (httpResponse.IsSuccessStatusCode)
        {
            Response responseData = JsonConvert.DeserializeObject<Response>(await httpResponse.Content.ReadAsStringAsync());
            userCollection = new ObservableCollection<User>(responseData.Users);
            User_List.ItemsSource = userCollection;
        }
    }

public class User
{
    [JsonProperty("id")]
    public int Id { get; set; }

    [JsonProperty("email")]
    public string Email { get; set; }

    [JsonProperty("first_name")]
    public string FirstName { get; set; }

    [JsonProperty("last_name")]
    public string LastName { get; set; }

    [JsonProperty("avatar")]
    public string AvatarURI { get; set; }

    public string FullName
    {
        get { return $"{FirstName} {LastName}"; }
    }
}

public class Response
{
    [JsonProperty("page")]
    public int Page { get; set; }

    [JsonProperty("per_page")]
    public int PerPage { get; set; }

    [JsonProperty("total")]
    public int Total { get; set; }

    [JsonProperty("total_pages")]
    public int TotalPages { get; set; }

    [JsonProperty("data")]
    public ObservableCollection<User> Users { get; set; }
}

XAML 文件的內容為：

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="TabbedPageTest.TeamMembersPage"
         BackgroundColor="{DynamicResource SecondaryColor}">
  <StackLayout>
    <Label Text="Team Members"/>
    <CollectionView x:Name="User_List" HeightRequest="400" >
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <ImageCell ImageSource="{Binding AvatarURI}" Text="{Binding FullName}" Detail="{Binding Email}"/>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
    <Button Text="Back" Clicked="OnBackButtonClicked" VerticalOptions="CenterAndExpand" />
  </StackLayout>
</ContentPage>

Answer 1

當我使用 ListView 控件而不是 CollectionView 時，應用程序運行成功並且沒有顯示錯誤。

我提到我使用了未正確測試的 ListView 控件。

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="TabbedPageTest.TeamMembersPage"
             BackgroundColor="{DynamicResource SecondaryColor}">
    <StackLayout>
        <Label Text="Team Members"/>
        <ListView x:Name="User_List" 
                  HeightRequest="400"
                  ItemSelected="OnListItemSelected">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ImageCell ImageSource="{Binding AvatarURI}" Text="{Binding FullName}" Detail="{Binding Email}"/>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <Button Text="Back" Clicked="OnBackButtonClicked" VerticalOptions="CenterAndExpand" />
    </StackLayout>
</ContentPage>