以前、HTMLページは、.Net Core 2.2のBlazorのクライアント側実装で、Blazorページの「@code」部分が実行される前(デフォルトのプロジェクトにある「Loading ...」メッセージ)にレンダリングされていました。ただし、サーバー側の実装でBlazorで.NET Core 3.0を使用している場合、これはもう起こりません。
たとえば、データベースからデータを取得したテーブルを含むページは、ページ上の他のすべての要素(見出し、ラベル、テーブルヘッダーなど)を引き続きロードしますが、ページはすべてのデータがプルされた後にのみロードされますデータベースから/「OnInitAsync」メソッドの操作が終了しました。これに加えて、ページをクリックすると実際に何かが読み込まれることをユーザーに示す「読み込み」信号はありません。すべてのデータが読み込まれるまで10〜15秒待つ必要があります(回転するカーソル/プロンプトはありません)。
要するに、ユーザーがページが読み込まれていることをユーザーが認識できるようにしたいのですが、理想的には、ページのHTMLがレンダリングされ、準備ができたときにまだ完了していないデータ/操作が表示されるようにしたいと思います(動作方法)クライアント側の実装)。
私はWeb開発/ Blazorが初めてなので、ここでかなり困惑しています。私はどこでもヒントを探してみましたが、それがどれほど新しいかを考えると、そこにはあまりありません。私はそれをデフォルトのプロジェクト(WeatherForecaseService)で動作させることを試みましたが、それでも動作しませんでした。
<html> a bunch of HTML </html>
@if (data == null)
{
<div class="spinner-border text-primary" role="status">
<span class="sr-only">Loading...</span>
</div>
}
@code
{
Data[] data;
protected override async Task OnInitAsync()
{
data = await TaskService.GetDataAsync();
}
}
上記の例で予想されるのは、データが読み込まれていることを示すスピナーがあるが、データが実際に読み込まれるまで(データがnullになることはない)ページがまったく読み込まれず、すべての要素が一度に表示されることです。 。これはサーバー側の実装が機能する方法ですか?
の新しい変更を使用できます
OnAfterRenderAsync(bool firstRender)このように:
protected override Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
//Your code
}
return base.OnAfterRenderAsync(firstRender);
}