Question

在Blazor ServerSide Asp.net core 3.0 Preview 6中，UI不会刷新。我以counter.razor为例进行了更改。如果单击按钮“将计数器设置为...”，则不会刷新计数器。当您单击“单击我”按钮（不带参数）时，将刷新UI，并将1添加到先前单击的计数器中。

按钮似乎可以使用，但是用户界面未刷新。

@page "/counter"

<h1>Counter</h1>

<p>Current count: @currentCount</p>
<br />

<p>
    <button class="btn btn-primary" @onclick="@IncrementCount">Click me</button>
</p>

    @for (int i = 0; i < 5; i++)
    {
        var a = i;
        <p><button class="btn btn-primary" onclick="@(() => test(a))">Set counter to @a</button></p>
    }

    @functions {
        int currentCount = 0;

        protected void IncrementCount()
        {
            currentCount++;
        }

        void test(int i)
        {
            currentCount = i;
        }
    }

关于如何解决此问题的任何建议，或者是Blazor中的错误？

Answer 1

@functions { }语法表明这是从Preview5开始的，但是在Preview6（当前）中，事件处理程序has changed的语法是：

在Blazor中指定事件处理程序现在使用新指令属性语法而不是常规HTML语法。语法是与HTML语法相似，但现在带有前导@字符。这个使C＃事件处理程序不同于JS事件处理程序。
  <button @onclick="@Clicked">Click me!</button>
为C＃事件处理程序指定委托时，@前缀为目前仍需要属性值，但我们希望在以后的更新中删除此要求。

因此您需要@onclick="@(() => test(a))

Answer 2

onclick属性是一个编译器伪指令，应在其前面加上 @ 符号。另外，“将计数器设置为@a”按钮使用了lambada表达式，即使用C＃，据我所知，有一个bug可能仍然存在。

Blazor团队开发人员的评论于6月5日发布，内容如下：

我知道我们应该修复@onclick以期待CSharp。应该有什么上面的列表中还有其他内容吗？

请使用@code代替@functions

希望这对您有帮助...

使用onclick函数传递参数时，Blazor无法刷新UI

2 个答案: