Question

我正在尝试使用树视图实现导航菜单。在左侧面板上有一个树视图，在右侧面板上有匹配的视图。因为它是MVVM，我很难在正确的视图之间切换。

enter image description here

单击Menu1 - 应显示View1.xaml视图单击Menu2 - 应显示View2.xaml视图

我的代码看起来像这样： MainView.xaml

<Window x:Class="Menu.View.MainView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:Views="clr-namespace:Menu.View"
        Title="MainView" Height="300" Width="300">
    <Window.Resources>
        <DataTemplate DataType="{x:Type Views:Page1}">
            <Views:Page1 />
        </DataTemplate>
        <DataTemplate DataType="{x:Type Views:Page2}">
            <Views:Page2 />
        </DataTemplate>
    </Window.Resources>
    <DockPanel>
        <Grid DockPanel.Dock="Left">
            <TreeView>
                <TreeViewItem Header="Menu 1" />
                <TreeViewItem Header="Menu 2" />
                <TreeViewItem Header="Menu 3" />
            </TreeView>
        </Grid>

        <Grid DockPanel.Dock="Right">
                <Views:Page1 />
                <Views:Page2 />
        </Grid>
    </DockPanel>
</Window>

Page1.xaml（单击“菜单1”时应显示的视图）

<Grid>
    <Label FontSize="24" FontWeight="Bold">1</Label>
</Grid>

Page2.xaml（单击“菜单2”时应该可见的视图）

<Grid>
    <Label FontSize="24" FontWeight="Bold">2</Label>
</Grid>

对于每个页面我都有自己的ViewModel，我有一个名为MainViewModel的主页面。我应该如何在MVVM模式下实现这样的东西？

Answer 1

我认为这是错误的。您应该将ViewModel放在DataType中。所以当你填充DataContext时，DataTemplate会完成他的工作。类似的东西：

   <DataTemplate DataType="{x:Type ViewModels:Page1ViewModel}">
                <Views:Page1 />
            </DataTemplate>
            <DataTemplate DataType="{x:Type ViewModels:Page2ViewModel}">
                <Views:Page2 />
            </DataTemplate>

而不是：

<Views:Page1 />
<Views:Page2 />

添加一个ContentControl并对其内容进行绑定，如下所示：

<ContentControl Content="{Binding MyViewModel}"></ContentControl>

myViewViewModel中的myView属性（which has to implement INotifyPropertyChanged）可以是这样的：

        object _MyView;
        public object MyViewModel
        {
            get
            {
                return _MyView;
            }
            set
            {
                _MyView = value;
                OnPropertyChanged("MyViewModel");
            }
        }

现在，在每个TreeViewItem中添加一个Command，它会更新它的内容以供例外：

在MainViewViewModel中

添加CallView1Command属性并实现它(see how dealing with commands)

所以在Command的excute方法中，您可以根据要显示的视图更新MyViewModel。

我建议使用 Unity 来实现ViewModel。

解释不是很好，但是，希望它无论如何都有帮助

mvvm导航树视图

1 个答案: