I cannot navigate to a second page more than once

Question

I'm using shell navigation, and I'm try to navigate from my main page to my second page by menu. It works with no problem the first time, but when I go back to the first screen ad try to go to the second screen again, nothing is happening.

Here is the XAML for the first page:

<?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"
             x:Class="LockAndKeyMaui.View.PasswdInfo"
             xmlns:viewmodel="clr-namespace:LockAndKeyMaui.ViewModel"
             x:DataType="viewmodel:Viewmodel"
             BackgroundColor="DarkGreen">

    <ContentPage.MenuBarItems>
        <MenuBarItem Text="Passwords">
            <MenuFlyoutItem Text="Create New Database"
                            Command="{Binding NewDbPageCommand}"/>
            <MenuFlyoutItem Text="Select Database"/>
        </MenuBarItem>
        <MenuBarItem Text="Groups"/>
        <MenuBarItem Text="Exit">
            <MenuFlyoutItem Text="Close Program"
                            Command="{Binding EndPrgCommand}"/>
        </MenuBarItem>
   </ContentPage.MenuBarItems>
</ContentPage>

To get to the second page I click on the "Create New Database" selection in the menu which is databound to the Viewmodel class that looks like this:

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;
using LockAndKeyMaui.View;
    
namespace LockAndKeyMaui.ViewModel
{
   public partial class Viewmodel : ObservableObject
   {
       [RelayCommand]
       void EndPrg()
       {
           Application.Current.Quit();
       }
    
       [RelayCommand]
       void NewDbPage()
       {
           Shell.Current.GoToAsync(nameof(NewDb));
       }
   }
}

Now it's calling the NewPageDb method, and it runs perfectly the first time.

In my second screen I have some XAML that looks like this:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="LockAndKeyMaui.View.NewDb"
             xmlns:vwmodel="clr-namespace:LockAndKeyMaui.ViewModel"
             x:DataType="vwmodel:DbViewmodel"
             BackgroundColor="DarkGreen"
             Title="NewDb">

    <VerticalStackLayout>
        <Button Text="Close"
                WidthRequest="150"
                HeightRequest="50"
                HorizontalOptions="Center"
                FontAttributes="Bold"
                FontSize="Small"
                Command="{Binding ClosePageCommand}"/>
    </VerticalStackLayout>
</ContentPage>

The ClosePageCommand looks like this:

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;`enter code here`

namespace LockAndKeyMaui.ViewModel
{
    public partial class DbViewmodel : ObservableObject
    {
        [RelayCommand]
        void ClosePage()
        {
            Shell.Current.GoToAsync("..");
        }
    }
}

I downloaded CommunityToolKit.Mvvm and CommunityToolKit.Maui.

So as I said, when I first run the program, the page switch works perfectly the first time. However, The second time and beyond when I try to click that selection to go to that page it seems like nothing is happening. I'm not even getting an error message.

So was something wiped out? What could possibly be wrong?

Answer 1

You need to await the GoToAsync method:

[RelayCommand]
private async Task NewDbPage()
{
    await Shell.Current.GoToAsync(nameof(NewDb));
}

[RelayCommand]
private async Task ClosePage()
{
    await Shell.Current.GoToAsync("..");
}

Answer 2

Yes, it is just the case as you said. And there is a known issue about this problem.

You can follow it up here: Command bound with MenuFlyoutItem is not getting executed, whereas Clicked event is working fine .

But you can try the following workaround:

<?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:local="clr-namespace:MauiApp323"

             x:Name="this"

             x:Class="MauiApp323.MainPage">

    <ContentPage.BindingContext>
        <local:Viewmodel></local:Viewmodel>
    </ContentPage.BindingContext>

    <ContentPage.MenuBarItems>
        <MenuBarItem Text="Passwords" BindingContext="{Binding Path= BindingContext,Source={x:Reference this}}">
            <MenuFlyoutItem Text="Create New Database"
                            Command="{Binding NewDbPageCommand}"/>
            <MenuFlyoutItem Text="Select Database"/>
        </MenuBarItem>
        <MenuBarItem Text="Groups"/>
        <MenuBarItem Text="Exit">
            <MenuFlyoutItem Text="Close Program"
                            Command="{Binding EndPrgCommand}"/>
        </MenuBarItem>
    </ContentPage.MenuBarItems>

</ContentPage>

Note:

Please add x:Name="this" for page PasswdInfo.xaml.