如何将TabControl绑定到ViewModels集合？

Question

如何将TabControl绑定到ViewModels集合？

基本上我在我的MainViewModel.cs中：

ObservableCollection<TabItem> MyTabs { get; private set; }

但是，我需要以某种方式不仅能够创建选项卡，而且还可以在维护MVVM的同时加载选项卡内容并将其链接到适当的视图模型。

基本上，我如何将用户控件作为tabitem的内容加载并将该usercontrol连接到适当的viewmodel。使这个困难的部分是ViewModel不应该构造实际的视图项，对吧？或者可以吗？

基本上，这是MVVM合适的：

UserControl address = new AddressControl();
NotificationObject vm = new AddressViewModel();
address.DataContext = vm;
MyTabs[0] = new TabItem()
{
    Content = address;
}

我只是问，因为我正在ViewModel中构建一个View（AddressControl），这对我来说听起来像MVVM禁忌。

Answer 1

在Prism中，您通常会将选项卡控件设置为一个区域，这样您就不必控制绑定的选项卡页面集合。<TabControl&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;x:Name="MainRegionHost" &nbsp;&nbsp;&nbsp;&nbsp;Regions:RegionManager.RegionName="MainRegion"&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;/>现在可以通过将自身注册到MainRegion区域来添加视图：RegionManager.RegisterViewWithRegion(&nbsp;"MainRegion",&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;(&nbsp;)&nbsp;=>&nbsp;Container.Resolve<IMyViewModel>(&nbsp;).View&nbsp;);在这里你可以看到Prism的特色。视图由ViewModel实例化。在我的情况下，我通过Inversion of Control容器（例如Unity或MEF）解析ViewModel。ViewModel通过构造函数注入获取View注入，并将自身设置为View的数据上下文。另一种方法是将视图的类型注册到区域控制器中：RegionManager.RegisterViewWithRegion(&nbsp;"MainRegion",&nbsp;typeof(&nbsp;MyView&nbsp;)&nbsp;);使用此方法允许您稍后在运行时创建视图，例如通过控制器：IRegion&nbsp;region&nbsp;=&nbsp;this._regionManager.Regions["MainRegion"]; object&nbsp;mainView&nbsp;=&nbsp;region.GetView(&nbsp;MainViewName&nbsp;); if&nbsp;(&nbsp;mainView&nbsp;==&nbsp;null&nbsp;) { &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;view&nbsp;=&nbsp;_container.ResolveSessionRelatedView<MainView>(&nbsp;); &nbsp;&nbsp;&nbsp;&nbsp;region.Add(&nbsp;view,&nbsp;MainViewName&nbsp;); }由于您已注册View的类型，因此视图将放置在正确的区域中

Answer 2

我有一个转换器来解耦UI和ViewModel，这就是以下几点：<TabControl.ContentTemplate> &nbsp;&nbsp;&nbsp;&nbsp;<DataTemplate> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<ContentPresenter&nbsp;Content="{Binding&nbsp;Tab,Converter={StaticResource&nbsp;TabItemConverter}"/> &nbsp;&nbsp;&nbsp;&nbsp;</DataTemplate></TabControl.ContentTemplate>Tab是我的TabItemViewModel中的枚举，TabItemConverter将其转换为真实的UI。在TabItemConverter中，只需获取值并返回所需的用户控件。