Mvvm navigation in WinUI

Question

I want to implement mvvm, to navigate to a new page within a NavBar.

The problem is that the docs for this package, isnot existent or comfuding (wpf.native, uwp.native, Uno.native) etc.

ViewModel

        public Command NavigateCommand { get; }

        public NavWindowViewModel() {

            NavigateCommand = new Command(NavigateAction);
        }

        private void NavigateAction(object obj) {
            throw new NotImplementedException();
        }
    }

View

 <NavigationView Background="{ThemeResource LayerOnAccentAcrylicFillColorDefault}"
                    IsBackButtonVisible="Collapsed"
                    IsSettingsVisible="False"
                    SelectedItem="{Binding SelectedItem}"
                    PaneDisplayMode="LeftCompact">
        <Interactivity:Interaction.Behaviors>
            <Core:EventTriggerBehavior EventName="SelectionChanged">
                
            </Core:EventTriggerBehavior>
        </Interactivity:Interaction.Behaviors>
        <NavigationView.MenuItems>
            <NavigationViewItem
                Content="Manage Class"
                Icon="People"
                Tag="ManageClassPage" />
            <NavigationViewItem
                Content="Create Meeting"
                Icon="VideoChat"
                Tag="CreateMeeting" />
        </NavigationView.MenuItems>

        <Frame />
    </NavigationView>

Answer 1

Hello @Eduardo Gomez , Welcome to Microsoft Q&A!

Use EventTriggerBehavior.Actions and InvokeCommandAction to handle event ItemInvoked,then use x:Bind to link your ViewModel commands.

      <Interactivity:Interaction.Behaviors>
        <Core:EventTriggerBehavior EventName="ItemInvoked">
            <Core:EventTriggerBehavior.Actions>
                <Core:InvokeCommandAction Command="{x:Bind viewModel.NavigateCommand}" />
            </Core:EventTriggerBehavior.Actions>
        </Core:EventTriggerBehavior>
    </Interactivity:Interaction.Behaviors>

        //using CommunityToolkit.Mvvm.ComponentModel;
        //using CommunityToolkit.Mvvm.Input;


        private ICommand _NavigateCommand;
        public ICommand NavigateCommand => this._NavigateCommand ?? (this._NavigateCommand = 
            new RelayCommand<NavigationViewSelectionChangedEventArgs>(OnItemInvoked));

        private void OnItemInvoked(NavigationViewSelectionChangedEventArgs args)
        {
            //NavigateTo your new page
            NavigationService.NavigateTo(args.SelectedItem);
        }

Thank you.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment". Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.