Blazor eventcallback 仅在设置 eventcallback 时执行一次答案

【问题标题】：Blazor eventcallback only executes once when eventcallback is setBlazor eventcallback 仅在设置 eventcallback 时执行一次
【发布时间】：2020-11-27 19:22:38
【问题描述】：

在 bazor wasm 中，我正在制作一个分页器组件，以向表格组件添加分页。分页器组件接受一个事件回调（PageChanged），当用户更改页面时执行该回调。

这里是风景

<div id="paginator-container">
<div id="paginator-controls">
    <button type="button"
            class="btn btn-action"
            @onclick="@this.GoToFirstPage"
            disabled="@this.IsFirstPage">
        <i class="fas fa-angle-double-left"></i>
    </button>
    <button type="button"
            class="btn btn-action"
            @onclick="@this.GoToPreviousPage"
            disabled="@this.IsFirstPage">
        <i class="fas fa-angle-left"></i>
    </button>
    <span>
        page @this.CurrentPage of @this.PageCount
    </span>
    <button class="btn btn-action"
            @onclick="@this.GoToNextPage"
            disabled="@this.IsLastPage">
        <i class="fas fa-angle-right"></i>
    </button>
    <button class="btn btn-action"
            @onclick="@this.GoToLastPage"
            disabled="@this.IsLastPage">
        <i class="fas fa-angle-double-right"></i>
    </button>
</div>

以及相关的代码

public partial class Paginator
{
    [Parameter]
    public int Lenght { get; set; }

    [Parameter]
    public EventCallback<InnosysPaginatorContext> PageChanged { get; set; }

    [Parameter]
    public int PageSize { get; set; } = 50;

    private int CurrentPage { get; set; }

    private int PageCount { get; set; }

    private bool IsFirstPage
        => this.CurrentPage == 1;

    private bool IsLastPage
        => this.CurrentPage == this.PageCount;

    protected override void OnParametersSet()
    {
        this.SetPageCount();

        this.CurrentPage = 1;

        base.OnParametersSet();
    }

    private void SetPageCount()
    {
        decimal pageCount = (decimal)this.Lenght / this.PageSize;

        if (pageCount != Math.Floor(pageCount))
        {
            pageCount = Math.Floor(pageCount + 1);
        }

        this.PageCount = (int)pageCount;
    }

    private async Task GoToFirstPage()
        => await this.GoToPage(1);

    private async Task GoToPreviousPage()
        => await this.GoToPage(this.CurrentPage - 1);

    private async Task GoToNextPage()
        => await this.GoToPage(this.CurrentPage + 1);

    private async Task GoToLastPage()
        => await this.GoToPage(this.PageCount);

    private Task GoToPage(int pageIndex)
    {
        this.CurrentPage = Math.Clamp(pageIndex, 1, this.PageCount);

        return this.ExecutePageChangedEvent();
    }

    private async Task ExecutePageChangedEvent()
        => await this.PageChanged.InvokeAsync(new InnosysPaginatorContext
        {
            CurrentPage = this.CurrentPage,
            PageSize = this.PageSize
        });
}

当我使用分页器而不设置PageChanged时，像这样：

<Paginator Lenght="300" />

我可以很好地浏览页面。

但是，如果我设置回调，像这样

<Paginator Lenght="300"
       PageChanged="@this.OnPageChangedTest" />

<p>Page: @pageIndex</p>

<p>page size: @pageSize</p>

@code{

    int pageIndex = 1;

    int pageSize = 50;

    void OnPageChangedTest(InnosysPaginatorContext innosysPaginatorContext)
    {
        pageIndex = innosysPaginatorContext.CurrentPage;

        pageSize = innosysPaginatorContext.PageSize;
    }

}

按钮只能工作一次，我只能进入第2页。随后单击下一页按钮执行回调，但分页器的CurrentPage卡在第2页。为什么会这样？

【问题讨论】：

@BrianParker，谢谢。我修改了代码以将其粘贴到此处，但忘记在粘贴之间进行修复。
快速提示：在 C# 中，this 对象是隐含的，与 JS 不同。您不需要指定它（除非尝试区分本地方法范围的变量和类值）
查看我的新答案：

标签： blazor blazor-webassembly

【解决方案1】：

问题一定出在这里：

this.CurrentPage = 1;

在 OnParametersSet 执行时执行；实际上，您不需要将 CurrentPage 设置为 1。如果您只需要执行一次，您应该在 OnInitialized(Async) 对中执行此操作

 protected override void OnParametersSet()
    {
        this.SetPageCount();

      //  this.CurrentPage = 1;

        base.OnParametersSet();
    }

【讨论】：