在 Blazor 模板视觉工作室 2019 中自动导航两个 razor 组件

Question

我有两个名称为"new"和"second"的剃须刀组件。我如何自动导航它们，我的意思是当有要显示的内容时，自动导航到新内容，当没有要显示的内容时，再次自动导航回秒。

这是新的： @page "/new">

<div class="Vistit">
<div class="container-fluid">
<div class="row h-100">
<div class="col-sm-8 ">

@foreach (var appointment in _visibleAppointments)
{
<div class="row mb-5">
<div class="col-sm-4"> <h1> @appointment.HeaderText: </h1> </div>
<div class="col-sm-8">
@foreach (var contactPerson in appointment.Contacts)
{
<h1> @contactPerson.Gender @contactPerson.Name </h1>
}
</div>
</div>
<div class="row mt-5"></div>
<div class="row mt-5"></div>
<div class="row mt-5">
<div class="col-sm-4"> <h1>Company:</h1> </div> <div class="col-sm-8"> <h1> @appointment.Company </h1> </div>
</div>
}
</div>
<div class="col-sm-4 ">
<TemplatedCarousel Items="AssetImages" TItem="ImageFile" AutoScrollInterval="3" OnCarouselItemClicked="OnCarouselItemClicked" ShowNavigation="false">
<ItemTemplate>
<div class="Slideimg">
<img class="d-block center" src="@GetImageSource(@context)" alt="@context.FileName">
</div>
<div class="Slogan">
<p>Here is slogan!</p>
</div>
</ItemTemplate>
</TemplatedCarousel>
</div>
</div>
</div>
</div>

这是第二个：@page"/秒">

<div class="SecondP">
<div class="container-fluid">
<div class="row h-100">
<div class="col-sm-6 ">
<video controls="controls" class="ml-auto" autoplay muted loop>
<source src="/Video/TestMovie_small.mp4" type="video/mp4" />
</video>
</div>
<div class="col-sm-6 ">
<TemplatedCarousel Items="AssetImages" TItem="ImageFile" AutoScrollInterval="3" OnCarouselItemClicked="OnCarouselItemClicked" ShowNavigation="false">
<ItemTemplate>
<img class="d-block center" src="@GetImageSource(@context)" alt="@context.FileName">
</ItemTemplate>
</TemplatedCarousel>
</div>
</div>
</div>
</div>

Answer 1

您可以在新的或秒中覆盖@code {}部分中的OnInitializedAsync()或OnInitialized()，并注入NavigationManager来帮助您。

@inject NavigationManager navigationManager // at the top
///HTML
@code
{
protected override Task OnInitializedAsync()
{
//if something is empty
navigationManager.NavigateTo("/second");
}
}