在用戶控件內點擊按鈕上的Chaning視圖

Question

我在窗口中有兩排網格。在第一行中有一個帶按鈕的堆疊面板。點擊一個按鈕會在網格的第二行顯示一個用戶控件（我已經完成了該部分的工作）。現在在用戶控件中有多個按鈕，它應該更改網格的第二行的內容（將當前用戶控件更改爲另一個）。 當我單擊Customers用戶控件中的一個按鈕並將一個斷點放置到BaseViewModel中的NavigationCommand時，它實際上會在那裏更改CurrentViewModel，但不會出現在實際窗口中。

MainWindow.xaml

<Window x:Class="TestProject.View.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:viewmodel="clr-namespace:TestProject.ViewModel" 
     xmlns:local="clr-namespace:TestProject" 
     xmlns:view="clr-namespace:TestProject.View" 
     mc:Ignorable="d" 
     Title="MainWindow" Width="966" Height="897"> 
    <Window.DataContext> 
     <viewmodel:MainWindowViewModel/> 
    </Window.DataContext> 
<Grid > 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto"></RowDefinition> 
     <RowDefinition Height="*"></RowDefinition> 
    </Grid.RowDefinitions> 
    <!--Верхнее меню --> 
    <Grid Grid.Row="0"> 
     <StackPanel HorizontalAlignment="Left" Orientation="Horizontal" > 
      <Button x:Name="Visits" Background="Transparent" Command="{Binding NavigationCommand}" CommandParameter="visits" BorderThickness="0" Width="Auto" Height="Auto" Margin="8,0,0,0">   
        <Image Source="../icon/document-changed.png" Width="16" Height="16"/> 
      </Button> 
      <Button x:Name="Patients" Background="Transparent" Command="{Binding NavigationCommand}" CommandParameter="patients" BorderThickness="0" Width="Auto" Height="Auto" Margin="8,0,0,0"> 
        <Image Source="../icon/document-changed.png" Width="16" Height="16"/> 
      </Button> 
      <Button x:Name="Customers" Background="Transparent" Command="{Binding NavigationCommand}" CommandParameter="customers" BorderThickness="0" Width="Auto" Height="Auto" Margin="8,0,0,0"> 
        <Image Source="../icon/user.png" Width="16" Height="16"/> 
      </Button> 
      <Button x:Name="Goods" Background="Transparent" Command="{Binding NavigationCommand}" CommandParameter="customer" BorderThickness="0" Width="Auto" Height="Auto" Margin="8,0,0,0"> 
        <Image Source="../icon/folder_documents.png" Width="16" Height="16"/> 
      </Button> 
      <Button x:Name="Services" Background="Transparent" Command="{Binding NavigationCommand}" CommandParameter="services" BorderThickness="0" Width="Auto" Height="Auto" Margin="8,0,0,0"> 
        <Image Source="../icon/folder_documents.png" Width="16" Height="16"/> 
      </Button>     
     </StackPanel> 
    </Grid> 
    <ContentControl x:Name="Content" Grid.Row="1" Content="{Binding CurrentViewModel}"></ContentControl> 
    </Grid> 
</Window> 

BaseViewModel

namespace TestProject.ViewModel 
{ 
    public class BaseViewModel : INotifyPropertyChanged 
    { 
     public event PropertyChangedEventHandler PropertyChanged = delegate { }; 
     protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null) 
     { 
      PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); 
     } 

     public DelegateCommand<string> NavigationCommand { get; set; }   
     public BaseViewModel() 
     {   
      NavigationCommand = new DelegateCommand<string>(OnNavigate);    
     } 

     private void OnNavigate(string navPath) 
     { 
      switch (navPath) 
      { 
       case "customers": 
        CurrentViewModel = new CustomersViewModel();      
        break; 
       case "visits": 
        CurrentViewModel = new VisitsViewModel();      
        break; 
       case "patients": 
        CurrentViewModel = new PatientsViewModel();      
        break; 
       case "customer":      
        CurrentViewModel = new CustomerViewModel(); 
        break; 
       case "visit":      
        CurrentViewModel = new VisitViewModel(); 
        break; 
      } 
     } 

     private object _currentViewModel; 

     public object CurrentViewModel 
     { 
      get { return _currentViewModel; } 
      set 
      { 
       if (_currentViewModel != value) 
       { 
        _currentViewModel = value; 
        OnPropertyChanged(); 
       } 
      } 
     } 
     private object _currentText; 

     public object CurrentText 
     { 
      get { return _currentText; } 
      set 
      { 
       if (_currentText != value) 
       { 
        _currentText = value; 
        OnPropertyChanged(); 
       } 
      } 
     } 
    } 
} 

Customers.xaml

<UserControl x:Class="TestProject.View.Customers" 
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="clr-namespace:TestProject.View" 
      xmlns:viewModel="clr-namespace:TestProject.ViewModel" 
      mc:Ignorable="d"  
      > 
    <UserControl.DataContext> 
     <viewModel:CustomersViewModel/> 
     </UserControl.DataContext> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="25"></RowDefinition> 
      <RowDefinition Height="50"></RowDefinition> 
      <RowDefinition Height="*"></RowDefinition> 
     </Grid.RowDefinitions> 
     <Label Grid.Row="0" Background="#FFF3EB96">Клиенты</Label> 
     <StackPanel Grid.Row="1" Orientation="Horizontal"> 
      <Button Command="{Binding NavigationCommand}" CommandParameter="customer" Background="Transparent" BorderThickness="0" Width="Auto" Height="Auto" Margin="8,0,0,0"> 
       <StackPanel Orientation="Horizontal"> 
        <Image Source="../icon/plus_32.png" Width="32" Height="32"/> 
       </StackPanel> 
      </Button> 

     </StackPanel> 
    </Grid> 
</UserControl> 

Answer 1

你似乎在所有視圖模型的公共基類中定義了CurrentViewModel屬性。這是錯誤的。

視圖中的ContentControl結合的視圖模型類，所以設定的CustomersViewModel的CurrentViewModel屬性不會影響結合到MainWindowViewModel的CurrentViewModel屬性ContentControl一個特定的實例。

CustomersViewModel應該直接引用MainWindowViewModel，否則您將不得不使用某種信使/事件聚合器或共享服務在它們之間進行通信：https://blog.magnusmontin.net/2014/02/28/using-the-event-aggregator-pattern-to-communicate-between-view-models/。

如果用在創建他們參考MainWindowViewModel注入子視圖模型，您可以使用此參考導航：

MainWindowViewModel：

public class MainWindowViewModel : INotifyPropertyChanged 
{ 
    public event PropertyChangedEventHandler PropertyChanged = delegate { }; 
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null) 
    { 
     PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); 
    } 

    public DelegateCommand<string> NavigationCommand { get; set; } 
    public BaseViewModel() 
    { 
     NavigationCommand = new DelegateCommand<string>(OnNavigate); 
    } 

    private void OnNavigate(string navPath) 
    { 
     switch (navPath) 
     { 
      case "customers": 
       CurrentViewModel = new CustomersViewModel(this); 
       break; 
      ... 
     } 
    } 

CustomersViewModel：

public class CustomersViewModel 
{ 
    private readonly MainWindowViewModel _vm; 
    public CustomersViewModel(MainWindowViewModel vm) 
    { 
     _vm = vm; 
     NavigationCommand = new DelegateCommand<string>(OnNavigate); 
    } 

    public DelegateCommand<string> NavigationCommand { get; set; } 


    private void OnNavigate(string navPath) 
    { 
     _vm.CurrentViewModel = new SomeOtherViewModel(); 
    } 
}