You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何将ViewModel中的ObservableCollection绑定到自定义视图?

解决方案

要让自定义的ResultsListView能够接收外部绑定的数据,你需要为它创建一个可绑定属性(BindableProperty),步骤如下:

1. 在ResultsListView的代码后台定义可绑定属性

在ResultsListView.xaml.cs中添加以下代码,定义用于接收集合数据的可绑定属性:

public partial class ResultsListView : ContentView
{
    // 定义可绑定属性,指定属性名、类型、所属控件类型及默认值
    public static readonly BindableProperty ItemsSourceProperty =
        BindableProperty.Create(
            nameof(ItemsSource), 
            typeof(ObservableCollection<FertInspectionResult>), 
            typeof(ResultsListView), 
            null);

    // 对应的CLR属性
    public ObservableCollection<FertInspectionResult> ItemsSource
    {
        get => (ObservableCollection<FertInspectionResult>)GetValue(ItemsSourceProperty);
        set => SetValue(ItemsSourceProperty, value);
    }

    public ResultsListView()
    {
        InitializeComponent();
    }
}

2. 修改ResultsListView的XAML绑定

更新CollectionView的ItemsSource绑定,让它指向我们刚定义的可绑定属性(需要通过RelativeSource指定绑定源为当前的ResultsListView控件):

<!-- 注意添加命名空间引用,替换成你的项目命名空间 -->
<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:YourAppNamespace"
             x:Class="YourAppNamespace.ResultsListView">
    <ContentView.Content>
        <CollectionView ItemsSource="{Binding ItemsSource, Source={RelativeSource AncestorType={x:Type local:ResultsListView}}}">
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <Label Text="{Binding SEQ}"/>
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
    </ContentView.Content>
</ContentView>

3. 在MainPage中绑定ViewModel的属性

最后修改MainPage.xaml,将ResultsListView的ItemsSource绑定到MainViewModel中的ResultsItems属性:

<ContentPage.Content>
   <vw:ResultsListView ItemsSource="{Binding ResultsItems}" /> 
</ContentPage.Content>

这样修改后,MainViewModel中的ResultsItems数据就能正确传递到ResultsListView的CollectionView中了。

内容的提问来源于stack exchange,提问作者Somachr

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.16 19:31:03