如何从模型中更新视图

本文关键字:更新 新视图 模型 | 更新日期: 2023-09-27 17:58:15

所以我试图在一个简单的示例应用程序中实现MVVM模式。从本质上讲,我的应用程序允许用户从设置页面中的搜索提供商列表中进行选择,然后在主页中,当用户单击"搜索"按钮时,他或她将被导航到搜索提供商的网站。一切似乎都很正常,没有错误,除了从SettingsPage直接导航回MainPage时,搜索属性似乎没有更新。不过,当应用程序完全退出并重新启动时,一切都很好。我的如下

主页.xaml.cs

void search_Click(object sender, EventArgs e)
    {
        TheBrowser.Navigate(App.ViewModel.SearchProvider.Address);
    }

App.xaml.cs

private static MainViewModel viewModel = null;
public static MainViewModel ViewModel
    {
        get
        {
            // Delay creation of the view model until necessary
            if (viewModel == null)
                viewModel = new MainViewModel();
            return viewModel;
        }
    }

MainViewMode.cs

public ListItem SearchProvider { get; private set; }
public MainViewModel()
    {
        SearchProvider = Settings.SearchProvider.Value;
    }
    public event PropertyChangedEventHandler PropertyChanged;
    private void NotifyPropertyChanged(String propertyName)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (null != handler)
        {
            handler(this, new PropertyChangedEventArgs(propertyName));
        }
    }

在我的设置页面中,允许用户选择搜索提供商

设置Page.xaml.cs

private void PopulateSearchProviderList()
    {
        searchProviderList = new ObservableCollection<ListItem>();
        searchProviderList.Add(new ListItem { Name = "Bing", Address = "http://www.bing.com" });
        searchProviderList.Add(new ListItem { Name = "Google", Address = "http://www.google.com" });
        SearchProviderListPicker.ItemsSource = searchProviderList;
    }
private void stk_Tap(object sender, System.Windows.Input.GestureEventArgs e)
    {
        if (SearchProviderListPicker.SelectedIndex != -1)
        {
            var selectedItem = (sender as StackPanel).DataContext as TestApp.Classes.ListItem;
            Settings.SearchProvider.Value = selectedItem; //Setting the search provider
        }
    }

最后是我的ListItem类,它是相当简单的

ListItem.cs

    public string Name
    {
        get;
        set;
    }
    public string Address
    {
        get;
        set;
    }

因此,从本质上讲,我没有根据SettingsPage正确更新ViewModel,但我不确定如何正确更新。

如何从模型中更新视图

您必须调用OnNotifyPropertyChanged("propertyName")才能在UI中更新项目。

例如(假设NameAddress属性绑定到UI元素。)

private string name;
private string address;
 public string Name
 {
     get { return name;}
     set { 
            name = value;
            OnNotifyPropertyChanged("Name");
         }
 }
 public string Address
 {
     get { return address; }
     set { 
             address = value ;
             OnNotifyPropertyChanged("Address");
          }
 }

我可以看到一些问题。我们将从那里开始。

  • 您的MainViewModel需要实现INotifyPropertyChanged,请参阅此处
  • 您的SearchProvider设置器需要提高PropertyChanged
  • 您需要设置SearchProvider的值。目前,这只在构造函数中执行,这可能就是为什么你只在应用程序启动时看到一些事情
  • 您需要确保在xaml中正确绑定了SearchProvider的值。如果你发布你的xaml,我们也可以查看

在ViewModel中,添加:

public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged([CallerMemberName] string caller = "")
{
    if (PropertyChanged != null)
    {
        PropertyChanged(this, new PropertyChangedEventArgs(caller));
    }
}

将SearchProvider属性更新为以下内容:

private ListItem searchProvider;
public ListItem SearchProvider
{
    get { return searchProvider; }
    set
    {
        searchProvider = value;
        OnPropertyChanged();
    }
}