我创建了一个"Razor Components"项目。我正在尝试在按下按钮时执行异步方法,但还无法弄清楚语法。
这是我的索引.razor:
@page "/"
@inject GenericRepository<Person> PersonRepository
@foreach (var person in persons)
{
<button onclick="@(() => Delete(person.Id))">❌</button>
}
@functions
{
async void Delete(Guid personId)
{
await this.PersonRepository.Delete(personId);
}
}
当我单击按钮时,没有任何反应。我尝试了各种返回类型(例如Task
)之类的东西,但无法弄清楚如何使其工作。如果我需要提供更多信息,请告诉我。
每个文档/教程仅适用于单击按钮的非异步无效调用。
您需要正确调用Delete
方法并使其返回Task
而不是void
:
<button onclick="@(async () => await Delete(person.Id))">❌</button>
@functions {
// ...
async Task Delete(Guid personId)
{
await this.PersonRepository.Delete(personId);
}
}
@WoIIe, 1. 使用 lambda 表达式作为 onclick 属性的值的目的是,您可以将值传递给 Delete 方法。如果您已经在代码中定义了 person 对象,则不必使用 lambda 表达式。只需这样做:onclick = "@Delete"
,并访问人。删除方法中的 Id。
- 您是否再次单击该按钮?我相信这段代码:
await this.PersonRepository.Delete(personId);
确实执行了,但您在 GUI 上没有看到任何响应,因为不建议使用 void 需要您调用 StateHasChanged();手动重新渲染。请注意,当您的方法"结束"时,StateHasChanged() 已经自动调用了一次,但由于您返回的是 void 而不是 Task,您应该再次调用 StateHasChanged() 以查看更改。但不要这样做。请参阅DavidG如何正确编码的答案。
这也是您可以编码的方式:
<button onclick="@Delete">Delete Me</button>
@functions {
Person person = new Person();
//....
async Task Delete()
{
await this.PersonRepository.Delete(person.Id);
}
}
根据请求提供更多代码...
foreach(var person in people)
{
<button onclick="@(async () => await Delete(person.Id))">Delete</button>
}
@functions {
// Get a list of People.
List<Person> People ;
protected override async Task OnParametersSetAsync()
{
People = await this.PersonRepository.getAll();
}
async Task Delete(Guid personId)
{
await this.PersonRepository.Delete(personId);
}
}
注意:如果您仍未解决问题,请显示所有代码