MVVM：页面内的框架导航

Question

我的应用程序正在使用SplitView，因为它的内容是Frame。我似乎无法弄清楚如何使用我的分割视图中的按钮来更改框架中的页面。现在我试图将SourcePageType绑定到我的视图模型，但这不起作用。这是我的设置。

框架

<SplitView.Content> 
     <Frame x:Name="frame" SourcePageType="{Binding FrameSource}"> 
      <Frame.ContentTransitions> 
       <TransitionCollection> 
        <NavigationThemeTransition> 
         <NavigationThemeTransition.DefaultNavigationTransitionInfo> 
          <EntranceNavigationTransitionInfo/> 
         </NavigationThemeTransition.DefaultNavigationTransitionInfo> 
        </NavigationThemeTransition> 
       </TransitionCollection> 
      </Frame.ContentTransitions> 
     </Frame> 
    </SplitView.Content> 

视图模型

private string frameSource; 
    public string FrameSource 
    { 
     get { return frameSource; } 
     set 
     { 
      frameSource = value; 
      RaisePropertyChanged("FrameSource"); 
     } 
    } 

    private RelayCommand<string> navCommand; 
    public RelayCommand<string> NavCommand 
    { 
     get 
     { 
      navCommand = new RelayCommand<string>(ExecuteNav); 
      return navCommand; 
     } 
    } 
    public void ExecuteNav(string page) 
    { 
     FrameSource = page; 
    } 

我使用MVVM光为我的框架。做这个的最好方式是什么？

Answer 1

我也一直在用这个使用mmvm light的方法，并且想出了这个方法，我在主窗口中使用了一个绑定到我想要显示的选定viewmodel的内容控件。这可能有点矫枉过正，但它有效，维护也不难。

在我创建一个菜单对象的主网页浏览模式：

private void constructMenu() 
    { 
     MenuMessages = new ObservableCollection<MenuMessage>(); 
     MenuMessages.Add(new MenuMessage 
     { 
      menutext = "FirstPage", 
      isactive = true, 
      newWindow = false, 
      viewModelName = "FirstPageViewModel" 
     }); 
     MenuMessages.Add(new MenuMessage 
     { 
      menutext = "2page", 
      isactive = true, 
      newWindow = false, 
      viewModelName = "2pageViewModel" 
     }); 

我有以下INotifyable属性：

public MenuMessage selectedmenuitem 
    public ObservableCollection<MenuMessage> MenuMessages 
public Object selectedViewModel 

除了

，我使用的每个视图模型是INotifyable属性格式

public FirstPageViewModel firstpageviewmodel; 
public 2PageViewModel firstpageviewmodel; 

我的主页xaml看起来像这样：

<Window 
    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:local="clr-namespace:Myproj" 
    xmlns:Views="clr-namespace:Myproj.Views" 
    xmlns:vm="clr-namespace:Myproj.ViewModel" 
    x:Class="Myproj.MainWindow" mc:Ignorable="d" 
    DataContext="{Binding Main, Source={StaticResource Locator}}"> 
     <Window.Resources> 
    <DataTemplate DataType="{x:Type vm:FirstPageViewModel}"> 
     <Views:FirstPageView/> 

    </DataTemplate> 
    <DataTemplate DataType="{x:Type vm:2PageViewModel}"> 
     <Views2pageView/> 
    </DataTemplate> 
    </Window.Resources> 
<DockPanel LastChildFill="True"> 
    <StackPanel DockPanel.Dock="Top" > 
     <ListView ItemsSource="{Binding MenuMessages}" SelectedItem="{Binding selectedmenuitem}" > 
      <ListView.ItemsPanel> 
       <ItemsPanelTemplate> <StackPanel Orientation="Horizontal"/></ItemsPanelTemplate>      
      </ListView.ItemsPanel> 
      <ListView.ItemTemplate> 
       <DataTemplate DataType="{x:Type MenuItem}" > 
        <TextBlock Text="{Binding menutext}"/> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 
    </StackPanel> 

     <ContentControl Content="{Binding selectedVM}" ></ContentControl> 
</DockPanel> 

在视图模型我调用以下方法的设置器selectedmenuitem的RaisePropertyChanged后：

private void switchviewmodel() 
    { 
     switch (selectedmenuitem.viewModelName) 
     { 
      case "FirstPageViewModel": 
       selectedVM = irstpageviewmodel; 
       break; 
      case "2PageViewModel": 
       selectedVM = 2pageviewmodel; 
       break; 
     } 
    }