صفحه بندی

@using BzCore.Components.Overlay

<BzPagination @bind-Page="_page" TotalPages="12" />

<p>صفحه: @_page / 12</p>

@code {
    private int _page = 1;
}

@using BzCore.Components.Overlay

@* Sibling = how many buttons show on each side of the current page *@
<BzPagination @bind-Page="_page" TotalPages="20" Sibling="1" />
<BzPagination @bind-Page="_page" TotalPages="20" Sibling="2" />

@code {
    private int _page = 5;
}

@using BzCore.Components.Overlay

@foreach (var item in PagedItems)
{
    <div>@item</div>
}

<BzPagination @bind-Page="_page" TotalPages="@TotalPages" />

@code {
    private int _page = 1;
    private const int PageSize = 4;

    private readonly List<string> _all =
        Enumerable.Range(1, 23).Select(i => $"Row #{i}").ToList();

    private int TotalPages => (int)Math.Ceiling(_all.Count / (double)PageSize);

    private IEnumerable<string> PagedItems =>
        _all.Skip((_page - 1) * PageSize).Take(PageSize);
}

@*
For EF Core, page on the server instead:

    var total = await db.Orders.CountAsync();
    var rows  = await db.Orders
                        .OrderBy(o => o.Id)
                        .Skip((_page - 1) * PageSize)
                        .Take(PageSize)
                        .ToListAsync();
*@