为什么我的上下文菜单在动态生成时看起来不同

Question

我正在尝试从我的基本视图模型动态绑定上下文菜单。我已经设法在功能上做了我想做的事情，但我仍然坚持我的动态上下文菜单与静态菜单相比的样子。似乎有一个额外级别的菜单项。我的视图模型看起来像这样。

 public ObservableCollection<ContextMenuItem> ContextMenuItems { get; protected set; }

protected Constructor 
{
     ContextMenuItems = new ObservableCollection<ContextMenuItem>()
                    {
                        new ContextMenuItem() {Caption = "Add/Replace Supporting Data", Command = AddReplaceSupportingCommand},
                        new ContextMenuItem() {Caption = "Display SupportingData", Command = DisplaySupportingDataCommand}
                    };
}

我们生成的第一个上下文菜单的xaml就像这样。

    <StackPanel Orientation="Vertical" Margin="0,20">
            <StackPanel.ContextMenu >
                <ContextMenu ItemsSource="{Binding ContextMenuItems}">
                    <ContextMenu.ItemTemplate>
                        <DataTemplate>
                            <MenuItem Command="{Binding Command}" Header="{Binding Caption}"/>
                        </DataTemplate>
                    </ContextMenu.ItemTemplate>
                </ContextMenu>
            </StackPanel.ContextMenu>
...

</StackPanel>

第二个上下文菜单的xaml如下所示

<StackPanel >
        <StackPanel.ContextMenu>
            <ContextMenu>
                <MenuItem Command="{Binding AddReplaceSupportingCommand}" Header="Add or Replace Supporting Data"/>
                <MenuItem Command="{Binding DisplaySupportingDataCommand}" Header="Display Supporting Data"/>
            </ContextMenu>
        </StackPanel.ContextMenu>
...
</StackPanel>

（为了完整性，这里是ContextMenuItem类）

public class ContextMenuItem : ReactiveObject
    {
        private string _Caption;
        public string Caption
        {
            get { return _Caption; }
            set { this.RaiseAndSetIfChanged(ref _Caption, value); }
        }

        public ReactiveCommand Command { get; set; }
    }

Answer 1

它看起来有所不同，因为ContextMenu，MenuBase具体，使用MenuItem作为ItemContainerStyle，因此您有效地将MenuItem包裹在MenuItem中}。试试这个：

<StackPanel Orientation="Vertical" Margin="0,20">
    <StackPanel.ContextMenu>
        <ContextMenu ItemsSource="{Binding ContextMenuItems}">
            <ContextMenu.ItemContainerStyle>
                <Style TargetType="{x:Type MenuItem}">
                    <Setter Property="Header" Value="{Binding Caption}"/>
                    <Setter Property="Command" Value="{Binding Command}"/>
                </Style>
            </ContextMenu.ItemContainerStyle>
        </ContextMenu>
    </StackPanel.ContextMenu>
    <!-- ... -->
</StackPanel>

如果您愿意，可以使用ItemTemplate，但使用TextBox代替

<StackPanel Orientation="Vertical" Margin="0,20">
    <StackPanel.ContextMenu >
        <ContextMenu ItemsSource="{Binding ContextMenuItems}">
            <ContextMenu.ItemContainerStyle>
                <Style TargetType="{x:Type MenuItem}">
                    <Setter Property="Command" Value="{Binding Command}"/>
                </Style>
            </ContextMenu.ItemContainerStyle>
            <ContextMenu.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Caption}"/>
                </DataTemplate>
            </ContextMenu.ItemTemplate>
        </ContextMenu>
    </StackPanel.ContextMenu>
    <!-- ... -->
</StackPanel>