英文:
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.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论