我想为表的每一行附加一个事件处理程序。
当用户右键单击row
时,我想在该行旁边打开一个小模式。
现在,要执行此操作,我不知道如何获取选定的行。文档显示要使用的UIMouseEventArgs
。我看到它只有一个参数Type
,我假设它是{{1} }或mousedown
... etc(鼠标事件的类型)。
如何获得用户右键单击的行?
表格
mouseover
模式
@inherits DashboardBase
@foreach (var ca in this.campaigns) {
<tr id="@ca.Id" onmousedown="@(async(ev)=>await OnClick(ev,ca))">
<td >@ca.Id</td>
<td>@ca.Name</td>
<td>@ca.State.Tag</td>
<td>@ca.CreatedAtUtc</td>
<td>@ca.IsPaused</td>
@if (this.SelectedId == ca.Id) {
<td><ModalHelper info="@ca"></ModalHelper></td>
@"test string"
}
</tr>
}
public class DashboardBase : BlazorComponent {
protected long SelectedId = -1;
[Parameter]
protected Campaign.Dto.CampaignInfo[] campaigns { get; set; }
protected void OnClick(UIMouseEventArgs args,CampaignInfo campaign) {
if (args.Button != 2) {
return;
}
Console.WriteLine("You pressed right on campaignID:" + campaign.Id);
this.SelectedId = campaign.Id;
this.StateHasChanged();
}
}
使用上面的代码,我可以打印文本,但是如果我尝试渲染组件,则会出现错误:
@inherits ModalHelperBase
<div>
<button onclick="@(async()=>await OnDeletePressedAsync())">Delete</button>
</div>
public class ModalHelperBase:BlazorComponent {
[Inject]
private CampaignService campaignService { get; set; }
[Parameter] protected CampaignInfo info { get; set; }
}
答案 0 :(得分:2)
尝试一下:
在OnMousePressed方法中,检查单击了哪个按钮。
npm run start : env.development
关于发现单击了哪一行,您可以将ca.Id的值传递给OnMousePressed方法,并对其进行处理。