如何在ListView的DataTemplate绑定上下文设置ViewModel属性

报错原因 #

你遇到的XFC0009错误，核心原因是：在XAML中直接给ViewModel的普通CLR属性使用<Binding>语法是不被允许的。XAML的Binding要求目标必须是BindableProperty（可绑定属性），而你CourseCardViewModel中的Course只是普通的CLR属性，不支持直接通过XAML绑定赋值。

你的实现思路没问题，无需舍弃CourseCardViewModel #

你的想法是合理的——将CourseCard作为独立组件，用专属的CourseCardViewModel处理自身的事件和数据逻辑，这是MVVM组件化的常规设计，并没有复杂化。接下来只需要调整绑定方式即可实现需求。

正确实现方案（保留CourseCardViewModel） #

方案1：给CourseCard添加BindableProperty（推荐） #

这是最符合Xamarin.Forms/.NET MAUI自定义控件规范的方式，通过给CourseCard添加一个可绑定属性作为传递Course对象的桥梁，再在属性变化时给CourseCard设置BindingContext并赋值给CourseCardViewModel。

步骤1：修改CourseCard.xaml.cs

添加Course可绑定属性，并在属性变化时初始化CourseCardViewModel：

using Xamarin.Forms; // 或 Microsoft.Maui.Controls
using YourAppNamespace.ViewModels;
using YourAppNamespace.Models;

namespace YourAppNamespace.Views
{
    public partial class CourseCard : ContentView
    {
        // 定义可绑定属性
        public static readonly BindableProperty CourseProperty = BindableProperty.Create(
            nameof(Course),
            typeof(Course),
            typeof(CourseCard),
            propertyChanged: OnCourseChanged);

        public Course Course
        {
            get => (Course)GetValue(CourseProperty);
            set => SetValue(CourseProperty, value);
        }

        private static void OnCourseChanged(BindableObject bindable, object oldValue, object newValue)
        {
            if (bindable is CourseCard card && newValue is Course course)
            {
                // 初始化ViewModel并赋值Course
                card.BindingContext = new CourseCardViewModel { Course = course };
            }
        }

        public CourseCard()
        {
            InitializeComponent();
        }
    }
}

步骤2：简化MainPage.xaml的ListView绑定

现在只需要直接给CourseCard的Course属性绑定列表项的Course对象即可：

<ListView ItemsSource="{Binding Courses}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <views:CourseCard Course="{Binding .}" />
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

方案2：通过RelativeSource绑定ViewModel的Course属性 #

如果你不想给CourseCard添加可绑定属性，也可以通过RelativeSource让CourseCardViewModel的Course属性绑定到ListView项的DataContext（即当前的Course对象）：

步骤1：在CourseCard.xaml中设置默认BindingContext

<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:vm="clr-namespace:YourAppNamespace.ViewModels"
             x:Class="YourAppNamespace.Views.CourseCard">
    <ContentView.BindingContext>
        <vm:CourseCardViewModel />
    </ContentView.BindingContext>

    <!-- 这里是CourseCard的UI内容，比如绑定Course的属性 -->
    <StackLayout>
        <Label Text="{Binding Course.Name}" />
        <Label Text="{Binding Course.Description}" />
    </StackLayout>
</ContentView>

步骤2：在MainPage.xaml中绑定ViewModel的Course属性

<ListView ItemsSource="{Binding Courses}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <views:CourseCard>
                <vm:CourseCardViewModel.Course>
                    <Binding Path="." RelativeSource="{RelativeSource AncestorType={x:Type ListViewItem}}" />
                </vm:CourseCardViewModel.Course>
            </views:CourseCard>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

额外优化（可选） #

如果你的项目使用了依赖注入（DI），可以在OnCourseChanged方法中从DI容器获取CourseCardViewModel，而不是直接new，这样更便于测试和维护：

private static void OnCourseChanged(BindableObject bindable, object oldValue, object newValue)
{
    if (bindable is CourseCard card && newValue is Course course)
    {
        // 从DI容器获取ViewModel（假设App.Current.Services是你的DI服务提供者）
        var viewModel = App.Current.Services.GetRequiredService<CourseCardViewModel>();
        viewModel.Course = course;
        card.BindingContext = viewModel;
    }
}

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