比如这样的元素标签：

<ul><li>十</li><li>百</li></ul>

通常要想实现事件点击或当前选中的效果都需要用JS来完成。现在有了Blazor，基本可以不用考虑JS了。

点击事件的代码

<ul><li @onclick="@(e => select(10))">十</li><li @onclick="@(e => select(100))">百</li></ul>@code {int cur_select_count = 10;void select(int count){cur_select_count = count;}}

每个li标签的onclick声明一个lamada表达式，然后通过传不同的参数来实现不同的处理。

选中状态

点击事件相对来说比较容易处理，那么选中状态呢？其实也容易，代码如下：

<ul><li @onclick="@(e => select(10))" class="@(cur_select_count==10?"selected":"")">十</li><li @onclick="@(e => select(100))" class="@(cur_select_count==100?"selected":"")">百</li></ul>

每个元素根据当前选中的值与自己的值判断是否一致，一致就是选中状态。

感觉用Blazor比用JavaScript的代码逻辑流畅了好多。