MAUI 后退按钮无法工作超过 1 级深度

Question

我正在使用 App.Shell，并且在很大程度上它非常适合此应用程序。 有时我想在页面堆栈中钻得更深一些，但是当我深入超过 1 层时，后退按钮将停止工作！

因此，从 Page1 到 Page2 ，我可以单击

<-

返回，它会按预期工作。 当我从第 2 页转到第 3 页时，后退按钮不起作用。 Android 后退按钮也是如此，适用于第 2 页，但不适用于第 3 页。

用于测试；我有 3 个页面（Page1、Page2、Page3）和 3 个视图模型。 我尝试过导航代码的变体，Shell 导航/页面导航/带/不带正斜杠等。

全部在 Maui.Program.cs 中注册

 builder.Services.AddTransient<Page1>();
 ...
 builder.Services.AddTransient<ViewModel3>();

我在 App.Shell 构造函数中有 3 个路由

public AppShell()
{
    InitializeComponent();

    Routing.RegisterRoute(nameof(Page1), typeof(Page1));
    Routing.RegisterRoute(nameof(Page2), typeof(Page2));
    Routing.RegisterRoute(nameof(Page3), typeof(Page3));
}

页面有一个导航按钮

  <Button Command="{Binding GoToPage2Command}" Text="Go to Two"/>
    

在 ViewModel 中有一个 RelayCommand

public partial class ViewModel1
{
    [RelayCommand]
    public async Task GoToPage2()
    {
        //BACK BUTTON WORKS
        //await Shell.Current.GoToAsync("Page2");

        //BACK BUTTON WORKS
        await Shell.Current.Navigation.PushAsync(new Page2(new ViewModel2()));
    }
}

public partial class ViewModel2
{
    [RelayCommand]
    public async void GoToPage3()
    {
        //BACK BUTTON DOESN'T WORK
        //await Shell.Current.GoToAsync("Page3");

        //BACK BUTTON DOESN'T WORK
        await Shell.Current.Navigation.PushAsync(new Page3(new ViewModel3()));
    }
}

指向页面左上角的后退按钮的箭头。

更新： 转到弹出菜单并选择第 2 页。如果从那里深入 2 页，您将遇到 bug？

Github： 我已经在这里添加了该项目。 请参阅自述文件.md

https://github.com/fatscally/Back-Button-Not-Working.git

Answer 1

弹出窗口中的

Route

属性似乎是问题所在。 希望了解更多的人在评论中解释一下？ ;)

<FlyoutItem FlyoutDisplayOptions="AsMultipleItems">

    <ShellContent
        Title="Page 1"
        Icon="one_icon.png"
        ContentTemplate="{DataTemplate local:OnePage}"
        ** Route="OnePage" />  <!-- << I believe this is the fault--> **
    <ShellContent
        Title="Page 2"
        Icon="two_icon.png"
        ContentTemplate="{DataTemplate local:TwoPage}"
        ** Route="TwoPage" />  <!-- << Delete this --> **
    <ShellContent
        Title="Page 3"
        Icon="three_icon.png"
        ContentTemplate="{DataTemplate local:ThreePage}"
        IsVisible="true"
        ** Route="ThreePage" /> <!-- << Delete this --> **

</FlyoutItem>