Aplikasi Blazor akan memeriksa apakah ada elemen html dengan id ={dialogId} di halaman:
Jika elemen seperti itu tidak ada, itu akan menggunakan penangan default untuk menampilkan pesan.
Jika elemen ini ada, elemen ini classadalah:
atur seperti components-reconnect-showketika mencoba menyambung kembali ke server,
atur components-reconnect-failedketika gagal terhubung ke server.
atur seolah- components-reconnect-refusedolah browser mencapai server sementara server menolak koneksi secara aktif
Secara default, dialogIdis components-reconnect-modal. Jadi, Anda dapat membuat elemen di halaman dan menggunakan CSS untuk mengontrol konten dan gaya yang Anda inginkan.
Demo:
Misalnya, saya membuat tiga bagian konten untuk ditampilkan dalam Pages/_Host.cshtml:
<divid="components-reconnect-modal"class="my-reconnect-modal components-reconnect-hide"><divclass="show"><p>
This is the message when attempting to connect to server
</p></div><divclass="failed"><p>
This is the custom message when failing
</p></div><divclass="refused"><p>
This is the custom message when refused
</p></div></div><app>
@(await Html.RenderComponentAsync<App>(RenderMode.ServerPrerendered))
</app><scriptsrc="_framework/blazor.server.js"></script>
Dan kemudian mari kita tambahkan beberapa CSS untuk mengontrol gaya:
Terima kasih. Aneh bahwa mereka meletakkannya di bawah model hosting
Aaron Hudon
@AaronHudon karena itu hanya terjadi jika kita menggunakan model Blazor Server Side :)
itminus
1
Tampaknya informasi ini telah dipindahkan ke sini .
drs9222
9
Untuk sisi javascript hal Blazor memperlihatkan API kecil melalui window.Blazorobjek.
Salah satu bagian dari API ini adalah defaultReconnectionHandleryang memungkinkan Anda untuk menyesuaikan pengalaman koneksi ulang termasuk pengaturan opsi yang berbeda untuk jumlah retrys dll.
Namun, juga memungkinkan untuk hanya menukar logika untuk menampilkan ReconnectionDisplay
Penerapan sederhana terlihat seperti ini dan memungkinkan Anda untuk mendapatkan kontrol atas proses:
Yah, itu adalah cara untuk menyelesaikannya juga. Tapi saya lebih suka cara @itminus. Terima kasih semua.
Melon NG
Tentu, itu tergantung pada kasus penggunaan Anda. Jika Anda memerlukan lebih banyak kontrol (mis. Jalankan kode khusus ketika koneksi gagal) menggunakan API adalah cara yang harus dilakukan. Jika Anda hanya ingin menukar UI Anda dapat pergi dengan saran @minmin.
Untuk sisi javascript hal Blazor memperlihatkan API kecil melalui
window.Blazor
objek.Salah satu bagian dari API ini adalah
defaultReconnectionHandler
yang memungkinkan Anda untuk menyesuaikan pengalaman koneksi ulang termasuk pengaturan opsi yang berbeda untuk jumlah retrys dll.Namun, juga memungkinkan untuk hanya menukar logika untuk menampilkan
ReconnectionDisplay
Penerapan sederhana terlihat seperti ini dan memungkinkan Anda untuk mendapatkan kontrol atas proses:
sumber