8

私は Blazor で遊んでいて、単純なアプリケーションを構築しようとしています。私が最初に試みたことの 1 つは、データを非同期的に (私の場合は LocalStorage から) ロードすることでした。

protected override async Task OnInitAsync()
{
    await Log.Log($"{nameof(IndexComponent)}.{nameof(OnInitAsync)}");
    Model = await LocalStorage.GetItem<DataModel>("model");
}

私のレンダリングコードは次のようになりました： 

<div>@Model.Attribute</div>

ページをレンダリングするときに NullReferenceException を取得していました。さらに、ブラウザが応答しない状態になり、ブラウザ タブを閉じて Blazor アプリケーションを再起動するしかありませんでした。

この動作は設計によるものであることが判明しましたが、どのドキュメントでも説明されていないことがわかりました。うまくいけば、それは他の誰かを助けるでしょう（以下の私自身の答えを見てください）。

4

1 に答える 1

13

要約すると、次のようになります。

Blazor は OnInitAsync メソッドを呼び出し、最初の中断 (待機) の直後にページを初めてレンダリングします。メソッドが終了すると、ページが再びレンダリングされます。

解決策は 2 つあります。1 つ目は、レンダリング コードが Model が null の場合を確実に処理できるようにすることです。したがって、代わりに：

<div>@Model.Attribute</div>

使用する：

<div>@Model?.Attribute</div>

空のdivを生成するか、または

@if (Model != null)
{
    <div>@Model.Attribute</div>
}

これはdivをまったく生成しません。

もう1 つの簡単な解決策は、Model が null にならないようにすることです。

protected DataModel Model { get; } = new DataModel();

最初に、Blazor の GitHub で問題を提起しました。そこから回答をほぼそのままコピーしました: https://github.com/aspnet/Blazor/issues/1703

コミュニティの非常に有益なメンバーは、問題が何であるかを非常に迅速に指摘し、すべての功績は彼らに与えられます. StackOverflow に知識をもたらすことで、他の人を助けようとしているだけです。

于 2018-11-20T21:36:25.260 に答える