Blazor グリッド ソートの概要

Blazor Data Table / Data Grid は、単一列、複数列、およびトライステート列のソート構成で昇順および降順の列のソートをサポートします。

Blazor グリッド ソートの例

コード スニペット

HeaderClickAction プロパティを使用して、Blazor データ グリッドで単一または複数の列を昇順降順にソートできます。TriState が有効な場合、列に適用されているソートを削除できます。

  • SortByMultipleColumns
  • SortByMultipleColumnsTriState
  • SortByOneColumnOnly
  • SortByOneColumnOnlyTriState
<DataGrid Height="100%" Width="100%" @ref="DataGridRef"
    HeaderClickAction="HeaderClickAction.SortByMultipleColumns"
    DataSource="DataSource" />

API を使用したソート

@code {
    // Using the ref property above:
    private DataGrid grid;
    private DataGrid DataGridRef
    {
        get { return grid; }
        set
        {
            grid = value;
            OnGridRefChanged();
            StateHasChanged();
        }
    }

    private void OnGridRefChanged()
    {
        if (this.DataGridRef != null)
        {
            this.DataGridRef.SortDescriptions.Add(new ColumnSortDescription()
            {
                Field = "Property",
                SortDirection = ListSortDirection.Descending
            });
        }
    }
}