英文:
Removing navigated pages from stack in .NET MAUI app
问题
I'm using AppShell in my .NET MAUI app and here's the scenario:
我在我的.NET MAUI应用程序中使用AppShell,以下是情况:
I have Page1, Page2 and Page3 defined as my main tab in AppShell -- see below:
我将Page1、Page2和Page3定义为AppShell中的主选项卡,如下所示:
<FlyoutItem Title="Home" Icon="home.png">
<Tab Title="Page 1" Icon="icon1.png">
<ShellContent Route="Page1" ContentTemplate="{DataTemplate local: Page1}" />
</Tab>
<Tab Title="Page 2" Icon="icon2.png">
<ShellContent Route="Page2" ContentTemplate="{DataTemplate local: Page2}" />
</Tab>
<Tab Title="Page 3" Icon="icon3.png">
<ShellContent Route="Page3" ContentTemplate="{DataTemplate local: Page3}" />
</Tab>
</FlyoutItem>
I tap on tab 3 and go to Page3. I then navigate to Page4 and from there to Page5 to fill out a form. I navigate to pages 4 and 5 by clicking page elements such as buttons, etc. The routes for Page4 and Page5 are defined in AppShell.xaml.cs -- see below:
我点击选项卡3,进入Page3。然后我导航到Page4,然后再到Page5以填写表单。我通过点击页面元素如按钮等导航到页面4和5。Page4和Page5的路由在AppShell.xaml.cs中定义,如下所示:
...
Routing.RegisterRoute(nameof(Page4), typeof(Page4));
Routing.RegisterRoute(nameof(Page5), typeof(Page5));
After filling out the form, I want to send the user to Page2 but also remove Page4 and Page5 from the stack.
填写表单后,我想将用户发送到Page2,但同时从堆栈中删除Page4和Page5。
I tried the following but it's not working exactly right:
我尝试了以下方法,但效果不是完全正确:
var route = $"../../{nameof(Page2)}";
await Shell.Current.GoToAsync(route);
This does send the user to Page2 after I submit the form but doesn't seem to remove Page4 and Page5 from the stack. So, if I tap on Page3 on the tab bar, I still end up on Page5 instead of Page3. That's because originally, I got to Page5 through this path:
这确实在我提交表单后将用户发送到Page2,但似乎没有从堆栈中删除Page4和Page5。因此,如果我在选项卡栏上点击Page3,我仍然会进入Page5而不是Page3。这是因为最初,我通过以下路径进入了Page5:
Page3 => Page4 => Page5.
How do I make sure I remove Page4 and Page5 from the navigation stack?
如何确保我从导航堆栈中删除Page4和Page5?
英文:
I'm using AppShell in my .NET MAUI app and here's the scenario:
I have Page1, Page2 and Page3 defined as my main tab in AppShell -- see below:
<FlyoutItem Title="Home" Icon="home.png">
<Tab Title="Page 1" Icon="icon1.png">
<ShellContent Route="Page1" ContentTemplate="{DataTemplate local: Page1}" />
</Tab>
<Tab Title="Page 2" Icon="icon2.png">
<ShellContent Route="Page2" ContentTemplate="{DataTemplate local: Page2}" />
</Tab>
<Tab Title="Page 3" Icon="icon3.png">
<ShellContent Route="Page3" ContentTemplate="{DataTemplate local: Page3}" />
</Tab>
</FlyoutItem>
I tap on tab 3 and go to Page3. I then navigate to Page4 and from there to Page5 to fill out a form. I navigate to pages 4 and 5 by clicking page elements such as buttons, etc. The routes for Page4 and Page5 are defined in AppShell.xaml.cs -- see below:
...
Routing.RegisterRoute(nameof(Page4), typeof(Page4));
Routing.RegisterRoute(nameof(Page5), typeof(Page5));
After filling out the form, I want to send the user to Page2 but also remove Page4 and Page5 from the stack.
I tried the following but it's not working exactly right:
var route = $"//../../{nameof(Page2)}";
await Shell.Current.GotoAsync(route);
This does send the user to Page2 after I submit the form but doesn't seem to remove Page4 and Page5 from the stack. So, if I tap on Page3 on the tab bar, I still end up on Page5 instead of Page3. That's because originally, I got to Page5 through this path:
Page3 => Page4 => Page5.
How do I make sure I remove Page4 and Page5 from the navigation stack?
答案1
得分: 2
我可以复现这个问题。这似乎是 maui 的一个新问题。根据关于 Maui Shell 中的后退导航 的官方文档,
> await Shell.Current.GoToAsync("../../route"); 在这个例子中,会执行两次后退导航,然后导航到指定的路由。
但是它并没有按预期工作。所以你可以在 GitHub 上发布一个新的问题,并使用以下代码在导航之前从导航堆栈中移除页面。
var stack = Shell.Current.Navigation.NavigationStack.ToArray();
for(int i = stack.Length - 1; i > 0; i--)
{
Shell.Current.Navigation.RemovePage(stack[i]);
}
Shell.Current.GoToAsync("//Page2");
英文:
I can reproduce the problem. It seems a new issue for the maui. According to the official document about the Backwards navigation in the Maui Shell,
> await Shell.Current.GoToAsync("../../route"); In this example,
> backwards navigation is performed twice, and then navigation to the
> specified route.
But it didn't work expectedly. So you can post a new issue on the github and use the following code to remove the page in the navigation stack before you navigate.
var stack = Shell.Current.Navigation.NavigationStack.ToArray();
for(int i = stack.Length - 1; i > 0; i--)
{
Shell.Current.Navigation.RemovePage(stack[i]);
}
Shell.Current.GoToAsync("//Page2");
答案2
得分: 2
你想要清除堆栈,然后位于Page2页面。
根据文档,这很简单:
await Shell.Current.GotoAsync($"//{nameof(Page2)}");
maui shell导航:
> "//route" ... 匹配的页面将替换导航堆栈。
英文:
You want the stack to be cleared, and then be on Page2.
According to the doc, this is as simple as:
await Shell.Current.GotoAsync($"//{nameof(Page2)}");
maui shell navigation:
> "//route" ... The matching page will REPLACE the navigation stack.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。


评论