如何在Blazor Wasm加载(即加载屏幕上)时显示从api获取的报价？

using System.Net.Http;
using System.Threading.Tasks;

public class QuoteService
{
    private readonly HttpClient _httpClient;

    public QuoteService(HttpClient httpClient)
    {
        _httpClient = httpClient;
    }

    public async Task<string> GetQuote()
    {
        var response = await _httpClient.GetAsync("api/quote"); // 替换为实际的API地址
        response.EnsureSuccessStatusCode();
        return await response.Content.ReadAsStringAsync();
    }
}

@page "/"
@inject QuoteService QuoteService

<h1>Welcome to Blazor Wasm</h1>

@if (isLoading)
{
    <p>Loading...</p>
}
else
{
    <p>@quote</p>
}

@code {
    private bool isLoading = true;
    private string quote;

    protected override async Task OnInitializedAsync()
    {
        quote = await QuoteService.GetQuote();
        isLoading = false;
    }
}

builder.Services.AddScoped<QuoteService>();
builder.Services.AddHttpClient<QuoteService>(client =>
{
    client.BaseAddress = new Uri("https://api.example.com"); // 替换为实际的API地址
});