.NET MAUI中为CollectionView的DataTemplate添加带参数按钮（MVVM）

需求：在CollectionView的每个列表项中添加按钮，采用MVVM模式开发，同时将当前项作为CommandParameter传递给命令。以下是我的实现代码，请求技术支持：

XAML代码 #

<CollectionView.ItemTemplate>
    <DataTemplate>
        <Grid HeightRequest="30" WidthRequest="1000" HorizontalOptions="FillAndExpand" x:DataType="model:Schueler" Margin="10,5,10,5">
            <Button Text="Edit" Command="{Binding Source={RelativeSource AncestorType={x:Type viewmodels:ManagePeopleViewModel}}, Path=EditCommand}" CommandParameter="{Binding .}"/>
            <Button Text="Löschen" Command="{Binding Source={RelativeSource AncestorType={x:Type viewmodels:ManagePeopleViewModel}}, Path=DeleteCommand}" CommandParameter="{Binding .}"/>
        </Grid>
    </DataTemplate>
</CollectionView.ItemTemplate>

ViewModel代码 #

public Command LoadCommand { get; set; }
public Command EditCommand { get; set; }

this.EditCommand = new Command((value) =>
{
    OnEditClicked((Schueler)value);
});
this.DeleteCommand = new Command((value) =>
{
    OnDeleteClicked((Schueler)value);
});

优化与验证建议 #

1. 简化命令绑定语法
   XAML中命令的绑定可以简化嵌套的Source写法，让代码更简洁：

Command="{Binding EditCommand, Source={RelativeSource AncestorType={x:Type viewmodels:ManagePeopleViewModel}}}"

2. 使用泛型Command提升类型安全性
   ViewModel中改用Command<Schueler>替代非泛型Command，无需手动强制转换参数，避免类型转换异常：

public Command<Schueler> EditCommand { get; set; }
public Command<Schueler> DeleteCommand { get; set; }

// 直接绑定到对应方法
this.EditCommand = new Command<Schueler>(OnEditClicked);
this.DeleteCommand = new Command<Schueler>(OnDeleteClicked);

// 方法直接接收强类型参数
private void OnEditClicked(Schueler selectedItem)
{
    // 编辑逻辑实现
}

private void OnDeleteClicked(Schueler selectedItem)
{
    // 删除逻辑实现
}

3. 修复布局重叠问题
   当前Grid内的两个按钮会重叠显示，添加列定义让按钮横向排列：

<Grid HeightRequest="30" WidthRequest="1000" HorizontalOptions="FillAndExpand" x:DataType="model:Schueler" Margin="10,5,10,5">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Button Text="Edit" Grid.Column="0" 
            Command="{Binding EditCommand, Source={RelativeSource AncestorType={x:Type viewmodels:ManagePeopleViewModel}}}" 
            CommandParameter="{Binding .}"/>
    <Button Text="Löschen" Grid.Column="1" 
            Command="{Binding DeleteCommand, Source={RelativeSource AncestorType={x:Type viewmodels:ManagePeopleViewModel}}}" 
            CommandParameter="{Binding .}"/>
</Grid>

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