我创建了 NavLink
的列表,这只是它们之间的一个区别,动态参数Id
<div>
@foreach (var service in pageGlobal.Person.Services)
{
var link = $"service_description/{service.Identifier}";
<ul class="nav flex-column">
<li class="nav-item px-3">
<NavLink class="nav-link" href="@link">
@service.Name
</NavLink>
</li>
</ul>
}
</div>
它只有在我第一次点击时才有效(无论它正常工作的 NavLink 项目是什么)。
单击下一个链接 - url 已更改,但没有任何 react 。
ServiceDescription.razor
的代码@page "/service_description/{Id:int}"
@using Site.Data
@using Site.ViewModels
@inject StartUpService page
@if (service != null)
{
<div> <h3>Service Name - @service.Name</h3> - <h4>@service.Description</h4> </div>
}
@code
{
[Parameter]
public int Id { get; set; }
PageGlobal pageGlobal;
Service service;
protected override async Task OnInitializedAsync()
{
pageGlobal = await page.GetPageGlobalAsync();
service = pageGlobal.Person.Services.Where(e => e.Identifier == Id).FirstOrDefault();
}
}
如何强制客户端重新加载
ServiceDescription.razor
使用 NavLink
使用新参数功能?
最佳答案
此问题是由 OnInitializedAsync
引起的.对于 OnInitializedAsync
,只有在组件准备启动时调用组件时才会调用它。
如果要换service
根据参数,您应该使用 OnParametersSetAsync
像下面这样:
protected override async Task OnParametersSetAsync()
{
pageGlobal = new PageGlobal
{
Person = new Person()
{
Services = new List<Service>(){
new Service{ Identifier = 1, Name = "Test1", Description = "D1" },
new Service{ Identifier = 2, Name = "Test2" , Description = "D2" },
new Service{ Identifier = 3, Name = "Test3", Description = "D3" }
}
}
};
service = pageGlobal.Person.Services.Where(e => e.Identifier == Id).FirstOrDefault();
}
您可以查看 ComponentBase
关于asp.net-core - 西装外套。单击多次时,NavLink 在 foreach block 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58512305/