Passing parameter from ViewModel to ViewModel in .NET MAUI using CommunityToolkit.MVVM

Question

My receiving Viewmodel (QuestionsPageViewModel) is not receiving the TopidId after passing it through Shell navigation as shown in the code below. I have placed the breakpoint at the LoadQuestions method in the QuestionsPageViewModel. When it is called, TopicId is null. What am I missing?

HomePageViewModel

//This is in a command executed after clicking a button. And this is working fine
await Shell.Current.GoToAsync($"{nameof(QuestionsPage)}?TopicId={pack.TopicId}");

QuestionsPageViewModel

[INotifyPropertyChanged]
[QueryProperty(nameof(TopicId), nameof(TopicId))]
    public partial class QuestionsPageViewModel
    {
        public ObservableRangeCollection<Question> QuestionsList { get; set; } = new();
        [ObservableProperty]
        string? title;

        [ObservableProperty]
        public string topicId;

        public QuestionsPageViewModel()
        {
            LoadQuestions();
        }

        async void LoadQuestions()
        {
            Title = Utilities.ConvertTopicIdToString(short.Parse(TopicId));

            try
            {
                using (var context = new DataContext())
                {
                    QuestionPack questionPack = context.QuestionPacks
                        .First(x => x.TopicId == short.Parse(TopicId));

                    var questions = JsonConvert.DeserializeObject<List<Question>>(questionPack.Questions);
                    QuestionsList.AddRange(questions);
                }

            }
            catch (Exception ex)
            {
                await Shell.Current.DisplayAlert("Error", $"Something went wrong: {ex}", "Cancel");
            }
        }
    }
}

Did you put a breakpoint on the gotoasync call, and verify that pack.topicid is not null? Why is property in one place topicId instead of TopicId? — ToolmakerSteve
– ToolmakerSteve, Commented Jun 3, 2022 at 16:50
I believe that ObservableProperty attribute is supposed to turn the private field into a public property — Jason
– Jason, Commented Jun 3, 2022 at 17:05
@ToolmakerSteve Yes I did. pack.topidId is not null. and as @Jason said, ObservableProperty makes it behind the scenes — Tanaka Mawere
– Tanaka Mawere, Commented Jun 4, 2022 at 16:28
@TanakaMawere could you please mark my answer as accepted if it was what you needed? — camionkraken
– camionkraken, Commented Jun 6, 2022 at 11:28

camionkraken · Accepted Answer · 2023-03-07 14:43:35Z

6

First of all, your field topicId should be private. CommumityToolkit.Mvvm will generate for you the public property.

Secondly, topicId is null because you're checking its value in a function called in the constructor. While you're executing the constructor, the shell navigation parameters are not initialized yet.

If you want to be sure that LoadQuestions() will be called after topicId is initialized, CommumityToolkit.Mvvm since version 8.0.0 should generate a partial method that can be used to execute some code after an ObservableProperty changes its value. In your case the name of this method should be OnTopicIdChanged(string value).

Try adding in your viewmodel this method and remove the function call from the constructor:

partial void OnTopicIdChanged(string value)
{
    LoadQuestions();
}

edited Mar 7, 2023 at 14:43

answered Jun 4, 2022 at 12:07

camionkraken

2,06213 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Tanaka Mawere Over a year ago

CommunityToolkit.Mvvm does not recognise that there is such a method

camionkraken Over a year ago

@TanakaMawere you need to use the latest preview version of CommunityToolkit.Mvvm (currently 8.0.0-preview4)

Tanaka Mawere Over a year ago

Is it stable enough to include into a production application? After updating, I am noticing errors from [ICommand]. RelayCommand is good enough without further edits?

camionkraken Over a year ago

Honestly I wouldn't use MAUI itself in a production application yet, but that's up to you. Anyway this is a very simple feature that you can verify firsthand in the autogenerated code, so it shouldn't cause any troubles. Can't guarantee for other sections of the toolkit. If you are worried about the preview, you could create TopicId as a classic property, without the ObservableProperty attribute and use the setter.

camionkraken Over a year ago

What kind of errors? I've used [ICommand] without problems.

|

Collectives™ on Stack Overflow

Passing parameter from ViewModel to ViewModel in .NET MAUI using CommunityToolkit.MVVM

1 Answer 1

8 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related