MAUI Blazor页面转换(通过MAUI路由而不是Blazor路由)-总是加载整个应用程序“加载.”

Question

我想有毛伊页过渡，所以它感觉更本土化。当我为“计数器”页面创建CounterPage.xaml并将其注册为单例，然后尝试使用await App.Current.MainPage.Navigation.PushModalAsync(new CounterPage());导航时，它总是用快速闪存“加载.”加载整个应用程序。(就像WASM)。我做错了什么？是因为“新的CounterPage()”吗？

Index.razor

@page "/"

<h1>Index</h1>

<button class="btn btn-secondary" @onclick="NavigateToCounterPage">MAUI navigation Counter</button>

@code {
    async void NavigateToCounterPage()
    {
        await App.Current.MainPage.Navigation.PushModalAsync(new CounterPage());
    }
}

CounterPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:pages="clr-namespace:MAUIBlazorMAUIPageTransition.Pages"
             x:Class="MAUIBlazorMAUIPageTransition.CounterPage"
             Title="CounterPage">
    <BlazorWebView HostPage="wwwroot/index.html">
        <BlazorWebView.RootComponents>
            <RootComponent Selector="#app" ComponentType="{x:Type pages:Counter}" />
        </BlazorWebView.RootComponents>
    </BlazorWebView>
</ContentPage>

CounterPage.xaml.cs

namespace MAUIBlazorMAUIPageTransition;

public partial class CounterPage : ContentPage
{
    public CounterPage()
    {
        InitializeComponent();
    }
}

MauiProgram.cs

builder.Services.AddSingleton<CounterPage>();

我试过了我能想到的一切。谢谢。

Answer 1

首先，名称中包含Modal的任何调用都用于显示稍后将返回的内容。你想往前走，然后再往前走。

不要使用该调用；可能使用GoToAsync。

第二，正如您所怀疑的那样，new CounterPage不是您想要的；它构建了一个新页面，这意味着它构建了一个新的BlazorWebView，这将导致您所看到的结果。

您已经完成了重复使用CounterPage所需的一半：

builder.Services.AddSingleton<CounterPage>();

另一半是再问一次。

我没有找到解释如何获得毛伊岛ServiceProvider的文档；如果有人可以解释如何做到这一点，那么您可以这样做：

var serviceProvider = ???;   // <-- TBD: What code goes here?
var page = serviceProvider.GetRequiredService<CounterPage>();
await App.Current.MainPage.Navigation.GoToAsync(page);