Blazor WASM 按钮 Onclick 每次都不会触发

Question

我有一个包含项目摘要的表格，当我单击一个按钮时，我会弹出一个模式，其中包含有关该项目的附加信息。不幸的是，由于某种原因，Blazor 不会总是弹出模式。它已经到了我已经简化代码只做一个 Console.WriteLine("Person Id: Id") 的地步，我仍然看到这个问题。

@foreach(var p in people){
  <tr>
    <td><button type="button" class="btn btn-outline-info" @onclick="(async()=>await ShowPerson(p))">@p.FirstName</button>
    </td>
    <td>@p.LastName</td>
  </tr>
}

然后在代码部分

List<Person> people { get; set; }
...
async Task ShowPerson(Person p){
  Console.WriteLine("Click");
  selectedPerson = p;
  await _jsRuntime.InvokeVoidAsync("toggleModal", "personModal");
}

然后在我的 js 文件中，toggleModal 只是执行 $("#" + id).modal('toggle');

现在，当我在查看控制台时，我可以单击一个按钮，并且控制台中可能没有任何显示，并且模式不会打开。或者单击显示在控制台中并弹出模式。有没有人遇到过这种情况，或者从上面的代码中看到了什么明显的东西？

谢谢

Answer 1

对于遇到这种情况并且像我一样盲目的其他人。验证您的 @onclick 是否在实际按钮上，而不是在范围内

不好：

<button class="btn btn-success">
  <span class="fa fa-bug" @onclick="(async()=>await foo(x))"></span>
</button>

好：

<button class="btn btn-success" @onclick="(async()=>await foo(x))">
  <span class="fa fa-thumbs-up"></span>
</button>

Answer 2

老实说，我有点惊讶它没有触发。您几乎可以将@onclick 放在任何东西上。