MAUI中DataTemplate内绑定变量无法获取值的问题

问题原因 #

CollectionView.ItemTemplate 中的 DataTemplate 上下文默认是集合中的单个数据项（即 ImagesJson 实例），而你要绑定的 TempColNum 是定义在 ProfileViewModel 中的属性。虽然 IntelliSense 会基于项目上下文给出提示，但运行时 DataTemplate 内的绑定会在当前数据项（ImagesJson）中查找属性，自然找不到 TempColNum，导致无法获取值。而在 DataTemplate 外部时，上下文是 ProfileViewModel，所以绑定正常。

解决方案 #

你需要明确指定绑定的数据源为父级的 ProfileViewModel，以下是两种常用方法：

方法1：使用 RelativeSource 关联父级 CollectionView

修改 Grid.Column 的绑定，通过 RelativeSource 找到父级 CollectionView，再引用它的 BindingContext（也就是 ProfileViewModel）：

<CollectionView.ItemTemplate>
    <DataTemplate>
        <Grid ColumnDefinitions="*,*">
            <VerticalStackLayout Grid.Column="{Binding BindingContext.TempColNum, Source={RelativeSource AncestorType={x:Type CollectionView}}}">
                <Image Source="{Binding MainImage}" Aspect="AspectFit" HeightRequest="120" x:DataType="model:ImagesJson"/>
                <Label Text="{Binding Topic}" x:DataType="model:ImagesJson"/>
                <Label Text="{Binding Likes}" x:DataType="model:ImagesJson"/>
            </VerticalStackLayout>
        </Grid>
    </DataTemplate>
</CollectionView.ItemTemplate>

方法2：使用 x:Reference 绑定页面的 ViewModel

如果你的页面有命名（比如 x:Name="ProfilePage"），可以直接引用页面的 BindingContext：

<ContentPage x:Name="ProfilePage" ...>
    <!-- 其他内容 -->
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Grid ColumnDefinitions="*,*">
                <VerticalStackLayout Grid.Column="{Binding BindingContext.TempColNum, Source={x:Reference ProfilePage}}">
                    <!-- 内部控件绑定不变 -->
                </VerticalStackLayout>
            </Grid>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</ContentPage>

注意事项 #

• 因为你在 DataTemplate 内的控件指定了 x:DataType="model:ImagesJson"，这会强制限定该控件的绑定上下文为 ImagesJson，所以必须显式指定 TempColNum 的数据源才能正确绑定。

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