使用 ViewModel-First MVVM Stylet 框架时将视图/视图模型添加到 ObservableCollection

如何解决使用 ViewModel-First MVVM Stylet 框架时将视图/视图模型添加到 ObservableCollection

当使用 viewmodel 第一个 MVVM 模式时，如何将您的 viewmodel 添加到 ObservableCollection 以便它们可以绑定到另一个 View 并显示为一个视图？

我正在使用 AvalonDock，并且正在努力将 AvalonDock 中的 LayoutDocument 窗格绑定到我的视图。

我使用 Stylet 作为我的 MVVM 框架，但我也将其标记为 Caliburn-Micro，因为我认为我的问题与 MVVM 的任何 viewmodel-First 实现相关。

我的测试 ObservableCollection 填充如下：

        Documents = new ObservableCollection<LayoutDocument>();

        LayoutDocument layout1 = new LayoutDocument();
        layout1.Title = "New Document";
        UserControl1 control = new UserControl1();
        layout1.Content = control;

        LayoutDocument layout2 = new LayoutDocument();
        layout2.Title = "New Document 2";
        Homeviewmodel control2 = Homeviewmodel;
        layout2.Content = control2;

        LayoutDocument layout3 = new LayoutDocument();
        layout3.Title = "New Document 3";
        HomeView control3 = HomeView;
        layout3.Content = control3;


        Documents.Add(layout1);
        Documents.Add(layout2);
        Documents.Add(layout3);

UserControl1 在后面的代码中通过 InitializeComponent() 初始化并且运行良好。见下图（第一个标签）。

Homeviewmodel 这就是我希望通过构造函数将它们内联到 Stylet 要求的方式，而 AvalonDock 似乎没有将其识别为 viewmodel。它只显示 viewmodel 的 URL。

HomeView（这是一个视图）已经删除了背后的代码，我原以为它会被 Stylet 初始化。该对象已通过构造函数注入。在 AvalonDock 中，它表现为一个未初始化的视图，所以什么都不显示。

这是构造函数：

public Dockingviewmodel(Homeviewmodel homeviewmodel,HomeView homeView)
    {
        Homeviewmodel = homeviewmodel;
        HomeView = homeView;
        LoadInitialTabs();
    }

我不认为问题出在 AvalonDock 上，但这里是视图的绑定方式。

<DockingManager.LayoutItemTemplate>
    <DataTemplate>
        <ContentControl Content="{Binding Content,FallbackValue=#ERROR Content.title#}"></ContentControl>
    </DataTemplate>
</DockingManager.LayoutItemTemplate>

请注意下图中 LayoutDocuments 以不同方式创建时的不同结果。

我怎样才能在 viewmodel 第一种方法（即使用 Stylet）中实现这一点？

解决方法

我找到了解决方案。当我使用 Stylet 时，我需要在我的视图中进行以下更改。

首先，添加 Stylet 的引用。

xmlns:s="https://github.com/canton7/Stylet"

第二：更改 DataContent 绑定：

<ContentControl Content="{Binding Content,FallbackValue=#ERROR Content.title#}"></ContentControl>

致：

<ContentControl s:View.Model="{Binding Content,FallbackValue=#ERROR Content.title#}"></ContentControl>

使用 Stylet，s:View.Model 位会自动从 View 中找到 ViewModel 并对其进行初始化。现在，我只能在 ViewModels 中容纳 ObservableCollection 并且它工作正常/