silverlight - 如何在 MVVM Light 中关闭 TabItem

Question

在我看来，我正在添加动态自定义 TabItems (TextseiteTabItem)。通过属性 DataContext，我为每个 TabItem 提供了一个可以使用的模型(填写值)。现在我向自定义 TabItems 添加了一个关闭命令，但它不起作用。我无法将关闭命令发送到 View 模型。以上是我的尝试..

我的自定义 TabItem:

<sdk:TabItem x:Class="PortfolioCreator.TextseiteTabItem" 
           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"
           mc:Ignorable="d"
           xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
           xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit">

    <sdk:TabItem.Header>
        <StackPanel Orientation="Horizontal">
            <sdk:Label Content="{Binding Seitennummer, StringFormat='Seite {0}', Mode=TwoWay}"/>
            <Button Content="X"
                    Command="{Binding CloseTabCommand, Mode=TwoWay}"
                    DataContext="{Binding ElementName=TemplateTabControl}"
                    CommandParameter="{Binding SelectedItem, ElementName=TemplateTabControl}" />   
        </StackPanel>
    </sdk:TabItem.Header>

    <sdk:TabItem.Content>
        <Grid x:Name="LayoutRoot">
            ...
        </Grid>
    </sdk:TabItem.Content>
</sdk:TabItem>

在我看来:

...
<sdk:TabControl toolkit:DockPanel.Dock="Bottom" ItemsSource="{Binding Tabs}" x:Name="TemplateTabControl"/>
...

在我的 View 模型中:

public class PortfolioViewModel : ViewModelBase
{
    public ObservableCollection<TabItem> Tabs { get; set; }

    public RelayCommand<TabItem> CloseTabCommand
    {
        get;
        private set;
    }

    public PortfolioViewModel()
    {
        CloseTabCommand = new RelayCommand<TabItem>(tab =>
        {
            //never reached
        },
        tab =>
        {
            //never reached
        });

        Tabs = new ObservableCollection<TabItem>();

        AddTextseite();
        AddTextseite();          
    }

    void AddTextseite()
    {
        TabItem item = new TextseiteTabItem();
        item.DataContext = new TextSeiteModel();

        Tabs.Add(item);
    }

}

Answer 1

首先，您的CloseTabCommand在您当前的代码片段中什么都不做://never reached .执行处理程序的内容应类似于 tab.Visibility = Visibility.Collapsed或 myTabControl.Items.Remove(myTabItem) .

其次，正如@Rafal 指出的那样，在 ViewModel 中使用 UI 元素并不是实现 MVVM 的正确方法。如果您想要可关闭的选项卡项目，正确的方法是派生通用 CloseableTabItem控制或写一个ClosableTabItemBehavior在 UI 层上设置 ICommand CloseCommand可以绑定(bind)到对应的ICommand ViewModel 上的实例。诚然，这种方法对于您的项目来说可能过于复杂。