在 Windows 10 通用应用程序中将命令绑定到集线器部分标题单击答案

【问题标题】：Bind command to hub section header click in Windows 10 Universal App在 Windows 10 通用应用程序中将命令绑定到集线器部分标题单击
【发布时间】：2015-09-05 04:50:49
【问题描述】：

假设我有一个中心页面 (HubPageView) 和该页面内的几个中心部分，例如

<Hub Header="{Binding AppName}">
   <HubSection IsHeaderInteractive="True" 
               Header="Section 1">
      ...
   </HubSection>
   ...
</Hub>

当呈现上述显示为“Section 1 See more”时，我认为如果用户点击“See more”，应用程序应该导航到 Section1PageView。

我正在努力遵循 MVVM 模式，因此我想将点击绑定到命令 (NavigateToSection1Command)，而不是使用 ItemClick 事件 - 我该如何实现？

【问题讨论】：

标签： mvvm win-universal-app

【解决方案1】：

Hub 类有一个 SectionHeaderClick 事件，您可以将 EventTriggerBehavior 附加到该事件并将您的 Command 绑定到它。

<Page xmlns:i="using:Microsoft.Xaml.Interactivity"
    xmlns:core="using:Microsoft.Xaml.Interactions.Core"

    <Hub Header="{Binding AppName}">
        <i:Interaction.Behaviors>
            <core:EventTriggerBehavior EventName="SectionHeaderClick">
                <core:InvokeCommandAction Command="{Binding NavigateToSectionCommand}" />
            </core:EventTriggerBehavior>
        </i:Interaction.Behaviors>
    </Hub>
</Page>

SectionHeaderClick 是 MS 为我们设置的与 Hub Header 交互的事件，但它的工作方式将使 MVVM 的生活更加艰难。您会看到，该事件将被单击的 Section 对象作为参数传递。通过附加命令，您将失去它，因为没有内置方法可以将事件参数传递给命令，并且无法判断命令是从哪个部分触发的。话虽如此，我认为在 HubSection 的 Header 中放置一个 Button 或 TextBlock 并将 EventTriggerBehavior 附加到它的 Click 事件会更好地满足您的需求。

Ps：您必须添加对 Behaviors SDK 的引用。转到添加引用 > 通用 Windows > 扩展，然后检查行为 SDK (XAML)

【讨论】：