为视图配置多ViewModel的BindingContext的最佳实践方案

针对你描述的场景，以下是几种主流的多BindingContext配置方案，按推荐优先级排序：

1. 主ViewModel聚合子ViewModel（推荐） #

这是MVVM架构下最规范的实现方式，通过主ViewModel（PageViewModel）持有子ViewModel的实例，页面始终保持单一BindingContext，通过绑定路径访问子ViewModel的属性。

实现步骤： #

• 在PageViewModel中注入或实例化子ViewModel：

public class PageViewModel
{
    // 子ViewModel实例，建议通过构造注入实现松耦合
    public SecondViewModel SecondVM { get; }

    public PageViewModel(SecondViewModel secondViewModel)
    {
        SecondVM = secondViewModel;
        // 原有ButtonClickedCommand等逻辑
    }

    public ICommand ButtonClickedCommand => new RelayCommand(/* 命令逻辑 */);
}

• 修改XAML绑定，通过路径指向子ViewModel的属性：

<!-- 原有按钮绑定保持不变 -->
<Button Text="Click here" Command="{Binding ButtonClickedCommand}" />

<!-- 绑定子ViewModel的数据源 -->
<CarouselView ItemsSource="{Binding SecondVM.NewList}">
    <CarouselView.ItemTemplate>
        <DataTemplate>
            <Label Text="{Binding ListItemName}" />
        </DataTemplate>
    </CarouselView.ItemTemplate>
</CarouselView>

优点：符合单一数据源原则，ViewModel依赖关系清晰，便于单元测试和维护，页面逻辑集中管理。

2. 给目标控件单独设置BindingContext #

直接为需要使用子ViewModel的控件指定独立的BindingContext，适合快速实现局部绑定场景。

方式一：后台代码注入 #

• 在页面后台注入两个ViewModel，分别绑定到页面和目标控件：

public partial class Page
{
    public Page(PageViewModel pageViewModel, SecondViewModel secondViewModel)
    {
        InitializeComponent();
        // 页面整体绑定主ViewModel
        BindingContext = pageViewModel;
        // 给CarouselView命名后，绑定子ViewModel
        MyCarousel.BindingContext = secondViewModel;
    }
}

• XAML中直接绑定子ViewModel的属性：

<CarouselView x:Name="MyCarousel" ItemsSource="{Binding NewList}">
    <CarouselView.ItemTemplate>
        <DataTemplate>
            <Label Text="{Binding ListItemName}" />
        </DataTemplate>
    </CarouselView.ItemTemplate>
</CarouselView>

方式二：XAML资源声明 #

• 在页面资源中声明子ViewModel，再绑定到控件：

<ContentPage.Resources>
    <vm:SecondViewModel x:Key="SecondVM" />
</ContentPage.Resources>

<CarouselView BindingContext="{StaticResource SecondVM}" ItemsSource="{Binding NewList}">
    <!-- 模板内容 -->
</CarouselView>

优点：快速实现局部独立绑定；缺点：控件BindingContext分散，ViewModel间交互需额外处理（如消息传递），不利于统一管理。

3. 使用RelativeSource绑定页面属性 #

将子ViewModel定义为页面后台的属性，通过RelativeSource向上查找页面实例来绑定，适合临时场景，但不符合MVVM关注点分离原则。

实现步骤： #

• 页面后台定义子ViewModel属性：

public partial class Page
{
    public SecondViewModel SecondVM { get; }

    public Page(PageViewModel pageViewModel, SecondViewModel secondViewModel)
    {
        InitializeComponent();
        BindingContext = pageViewModel;
        SecondVM = secondViewModel;
    }
}

• XAML中通过RelativeSource绑定：

<CarouselView ItemsSource="{Binding Source={RelativeSource AncestorType={x:Type local:Page}}, Path=SecondVM.NewList}">
    <CarouselView.ItemTemplate>
        <DataTemplate>
            <Label Text="{Binding ListItemName}" />
        </DataTemplate>
    </CarouselView.ItemTemplate>
</CarouselView>

优点：无需修改主ViewModel；缺点：耦合页面后台代码，模糊ViewModel与页面的边界，不推荐在大型项目中使用。

内容的提问来源于stack exchange，提问作者eengstroem