Exrin: ViewModel vs VisualState vs Model vs ModelState clarification

Question

I've watched through the Exrin tutorial multiple times and have looked through the couple different samples online which are very helpful to getting started, but one thing I'm having a hard time understanding is the ViewModel vs VisualState vs Model vs ModelState approach Exrin uses and would like some clarification as to what types of properties/other items get stored in each and how they relate to each other.

Answer 1

First, here is a diagram of how it is setup.

Second, going through an example. Say you have an API that gets a list of items.

You would do this.

1. In your Model, create a method that calls the Service or API to get a list of items.
2. In your ViewModel, in OnNavigated/ICommand, or whatever event you want to call it from, make a call to the Model to get this list of items.
3. Store this list of items in a property in your VisualState
4. In your View in XAML, {Binding VisualState.ListOfItems}