如何通过单击blazor中的按钮将数据从foreach循环传递到另一个页面

Question

我想通过单击按钮添加问题，将foreach循环中当前客户的customer.Id传递到另一个页面。

<tbody>
@foreach (var customer in customers)
{
<tr>
<td>@customer.Id / @customer.LastName / @customer.Email</td>
<RadzenButton Text="Add issue" ButtonStyle="Radzen.ButtonStyle.Secondary" Click="@GoToCustomerIssue"/>
<RadzenButton Text="Edit" ButtonStyle="Radzen.ButtonStyle.Secondary" />
<RadzenButton Text="Delete" ButtonStyle="Radzen.ButtonStyle.Secondary" />
</tr>       
}
</tbody>

public int GoToCustomerIssue()
{
NavManager.NavigateTo($"/customerissue/{}")
}

Answer 1

您可以将lambda传递给事件处理程序。所以你的线路：

<RadzenButton Text="Add issue" ButtonStyle="Radzen.ButtonStyle.Secondary" Click="@GoToCustomerIssue"/>

可以很容易地修改为lambda:

<RadzenButton Text="Add issue" ButtonStyle="Radzen.ButtonStyle.Secondary" Click="() => GoToCustomerIssue(customer.Id)" />

这允许您捕获本地上下文(customer(，并将所需内容传递给事件处理程序。显然，您的事件处理程序需要进行修改才能接受该参数：

public int GoToCustomerIssue(int customerId)
{
NavManager.NavigateTo($"/customerissue/{customerId}")
}

尽管如此，可能更习惯的做法是根本不使用事件处理程序，只需构造URL以直接合并id，但我认为RadzenButton不支持这个概念。

Answer 2

您可以使用布尔值来显示客户服务逻辑，而不是导航。

本页

<tbody>
@foreach (var customer in customers)
{
<tr>
<td>@customer.Id / @customer.LastName / @customer.Email</td>
<RadzenButton Text="Add issue" ButtonStyle="Radzen.ButtonStyle.Secondary" Click="()=>GoToCustomerIssue(customer)"/>
<RadzenButton Text="Edit" ButtonStyle="Radzen.ButtonStyle.Secondary" />
<RadzenButton Text="Delete" ButtonStyle="Radzen.ButtonStyle.Secondary" />
</tr>       
}
</tbody>
@if (SelectedCustomer is not null){
<CustomerIssue Customer=SelectedCustomer />
}
@code {
List<customer> customers {get; set;} // or whatever your customer class is called
customer SelectedCustomer {get; set;}
GoToCustomerIssue(customer clickedCustomer){
SelectedCustomer = clickedCustomer;
}
}

然后将您的客户服务页面更改为组件，customerissue.razor使用您的客户类，而不仅仅是ID:

@code{
[Parameter]
public customer Customer {get; set;}
}

这样，您就可以访问整个客户类别(ID、姓氏、电子邮件等(，而不仅仅是ID，而且您不必导航到新页面。别担心，在您选择客户之前，浏览器甚至不会开始加载客户服务页面。