Navigating using TabBar doesn't refresh page

Pablo Souza 26 Reputation points
2022-08-23T01:16:52.487+00:00

I have a Shell MAUI app with two pages: a form and a list. After inserting a new record with the form and navigating to the list page, it's not updated. I can easily achieve this without MVVM using this:

   private void OnBackToMenu(object sender, EventArgs e)  
       {  
           Navigation.PushAsync(new MainPage());  
       }  

How can I achieve the same with MVVM?

Here's my shell:

   <Shell  
       x:Class="Production.Savings.Maui.AppShell"  
       xmlns="http://schemas.microsoft.com/dotnet/2021/maui"  
       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"  
       xmlns:local="clr-namespace:Production.Savings.Maui"  
       xmlns:views="clr-namespace:Production.Savings.Maui.Views"  
       Shell.FlyoutBehavior="Disabled">  
     
       <TabBar>  
           <Tab Title="Transactions">  
               <ShellContent ContentTemplate="{DataTemplate views:TransactionsPage}" />  
           </Tab>  
           <Tab Title="Add New">  
               <ShellContent ContentTemplate="{DataTemplate views:AddNewPage}" />  
           </Tab>  
       </TabBar>  
     
   </Shell>  
     
     
   public partial class AppShell : Shell  
   {  
   public AppShell()  
   {  
   InitializeComponent();  
     
           Routing.RegisterRoute(nameof(TransactionsPage), typeof(TransactionsPage));  
           Routing.RegisterRoute(nameof(AddNewPage), typeof(AddNewPage));  
       }  
   }  

View:

   <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"  
                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"  
                x:Class="Production.Savings.Maui.Views.TransactionsPage"  
                xmlns:viewmodel="clr-namespace:Production.Savings.Maui.ViewModels"  
                xmlns:model="clr-namespace:Production.Savings.Maui.Models"  
                x:DataType="viewmodel:TransactionsViewModel"  
                Title="TransactionsPage">  
       <VerticalStackLayout>  
           <CollectionView x:Name="transactionsList"  
                           ItemsSource="{Binding Transactions}"  
                           SelectionMode="None">  
               <CollectionView.ItemTemplate>  
                   <DataTemplate x:DataType="model:Transaction">  
                       <Label Text="{Binding Amount}"/>  
                   </DataTemplate>  
               </CollectionView.ItemTemplate>  
           </CollectionView>  
       </VerticalStackLayout>  
   </ContentPage>  


   public partial class TransactionsPage : ContentPage  
   {  
   public TransactionsPage(TransactionsViewModel vm)  
   {  
   InitializeComponent();  
     
           BindingContext = vm;  
       }   
   }  

Viewmodel:

   public partial class TransactionsViewModel: ObservableObject  
   {  
       public TransactionsViewModel()  
       {  
           Transactions = new ObservableCollection<Transaction>(App.TransactionRepository.GetAllTransactions());  
       }  
     
       [ObservableProperty]  
       ObservableCollection<Transaction> transactions;  
   }  
.NET MAUI
.NET MAUI
A Microsoft open-source framework for building native device applications spanning mobile, tablet, and desktop.
1,083 questions
{count} votes