Bagaimana untuk Memaparkan Penunjuk Pemuatan Secara Berkesan Semasa Panggilan API Blazor?

Cara Memaparkan Kursor Tunggu atau Spinner Semasa Panggilan API dalam Blazor

Masalah:
Lama- menjalankan panggilan API dalam apl Blazor memerlukan cara untuk memberikan maklum balas visual kepada pengguna, seperti kursor menunggu atau memuatkan pemutar. Walau bagaimanapun, menogol keadaan ini secara manual menggunakan CSS mungkin gagal memuat semula halaman dengan segera.

Penyelesaian 1: Menggunakan Tugasan. Kelewatan(1)

• Buat async kaedah untuk melaksanakan operasi jangka panjang.
• Dalam kaedah async, gunakan await Tugasan.Tunda(1) atau tunggu Tugasan.Hasil() untuk mengepam perubahan.

private async Task AsyncLongFunc()
{
    spinning = true;
    await Task.Delay(1); // flush changes
    LongFunc(); // non-async code
    currentCount++;
    spinning = false;
    await Task.Delay(1); // flush changes again
}

Penyelesaian 2: Menggunakan Task.Run() (Bukan untuk WebAssembly)

• Balut operasi yang telah lama berjalan dalam Tugasan.
• Gunakan tunggu Task.Run() untuk melaksanakan Tugasan pada urutan yang berasingan.

async Task AsyncLongOperation()
{
    spinning = true;
    await Task.Run(() => LongOperation());
    currentCount++;
    spinning = false;
}

Pertimbangan untuk Pra-Rendering Bahagian Pelayan:

• Pemutar tidak akan dipaparkan dalam apl Pelayan Blazor yang telah diberikan sebelumnya.
• Untuk memaparkan pemutar, lakukan operasi yang lama dalam kaedah kitaran hayat OnAfterRenderAsync.

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        await Task.Run(() => LongOperation()); // or Task.Delay(0) without Task.Run
        StateHasChanged();
    }
}

Atas ialah kandungan terperinci Bagaimana untuk Memaparkan Penunjuk Pemuatan Secara Berkesan Semasa Panggilan API Blazor?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!