IgbGrid の初期表示時に任意の行を選択する方法について解説します。
IgbGrid の設定
まず、IgbGrid コンポーネントを設定します。
- @ref を使用して、このコンポーネントへの参照を作成します
- PrimaryKey プロパティを使用して、各行を一意に識別するキーを設定します(この例では Id をキーとします)
<IgbGrid ....
@ref = "grid"
PrimaryKey="@nameof(Person.Id)">
</IgbGrid>
SelectRowsAsync メソッドの使用
初期表示時に特定の行を選択するためには、コンポーネントがレンダリングされた後に非同期的に実行する OnAfterRenderAsync メソッドを利用します。
firstRender パラメータが true の場合、つまり初回レンダリング時に、EnsureReady メソッドを使用して、グリッドが準備完了であることを確認し、SelectRowsAsync メソッドを使用して特定の行を選択します。
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
await this.grid?.EnsureReady()!;
object[] array = new object[] { 3 };
await this.grid?.SelectRowsAsync(array, true)!;
}
}
実行結果
上記の設定を行うと初期表示時に指定した行(この例では Id が 3 の行)が選択状態になります。
