如何在Syncfusion SfTreeView中正确配置HierarchicalDataTemplate

普通WPF TreeView和Syncfusion SfTreeView在层级数据绑定上的核心差异在于SfTreeView需要明确指定子项属性名称，且对不同数据类型的模板处理需要更清晰的定义。以下是具体调整方案：

前提确认 #

假设你的模型定义如下（需确保实现INotifyPropertyChanged）：

public class ExcelFileModel : INotifyPropertyChanged
{
    private string _fileName;
    public string FileName
    {
        get => _fileName;
        set { _fileName = value; OnPropertyChanged(); }
    }

    public ObservableCollection<ExcelSheetModel> Sheets { get; set; } = new();

    public event PropertyChangedEventHandler PropertyChanged;
    private void OnPropertyChanged([CallerMemberName] string propName = null)
        => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propName));
}

public class ExcelSheetModel : INotifyPropertyChanged
{
    private string _sheetName;
    public string SheetName
    {
        get => _sheetName;
        set { _sheetName = value; OnPropertyChanged(); }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    private void OnPropertyChanged([CallerMemberName] string propName = null)
        => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propName));
}

方案1：使用DataTemplateSelector（推荐，类型区分更清晰） #

1. 创建模板选择器类 #

public class ExcelItemTemplateSelector : DataTemplateSelector
{
    public DataTemplate FileTemplate { get; set; }
    public DataTemplate SheetTemplate { get; set; }

    public override DataTemplate SelectTemplate(object item, DependencyObject container)
    {
        return item switch
        {
            ExcelFileModel => FileTemplate,
            ExcelSheetModel => SheetTemplate,
            _ => base.SelectTemplate(item, container)
        };
    }
}

2. 在XAML中定义资源与模板 #

<Window.Resources>
    <!-- 文件项模板 -->
    <DataTemplate x:Key="ExcelFileTemplate">
        <TextBlock Text="{Binding FileName}" />
    </DataTemplate>

    <!-- 工作表项模板 -->
    <DataTemplate x:Key="ExcelSheetTemplate">
        <TextBlock Text="{Binding SheetName}" />
    </DataTemplate>

    <!-- 模板选择器实例 -->
    <local:ExcelItemTemplateSelector x:Key="ExcelTemplateSelector"
                                     FileTemplate="{StaticResource ExcelFileTemplate}"
                                     SheetTemplate="{StaticResource ExcelSheetTemplate}" />
</Window.Resources>

3. 配置SfTreeView #

<syncfusion:SfTreeView ItemsSource="{Binding ExcelFiles}"
                       ChildPropertyName="Sheets"
                       ItemTemplateSelector="{StaticResource ExcelTemplateSelector}" />

方案2：使用DataTrigger动态绑定属性 #

如果不想额外创建选择器类，可通过触发器在单个模板中区分类型：

<syncfusion:SfTreeView ItemsSource="{Binding ExcelFiles}"
                       ChildPropertyName="Sheets">
    <syncfusion:SfTreeView.ItemTemplate>
        <HierarchicalDataTemplate ItemsSource="{Binding Sheets}">
            <TextBlock>
                <TextBlock.Style>
                    <Style TargetType="TextBlock">
                        <!-- 默认绑定文件名 -->
                        <Setter Property="Text" Value="{Binding FileName}" />
                        <!-- 当数据为工作表时，切换绑定表名 -->
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding}" Value="{x:Type local:ExcelSheetModel}">
                                <Setter Property="Text" Value="{Binding SheetName}" />
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </TextBlock.Style>
            </TextBlock>
        </HierarchicalDataTemplate>
    </syncfusion:SfTreeView.ItemTemplate>
</syncfusion:SfTreeView>

关键注意事项 #

• ChildPropertyName必须准确：此属性是SfTreeView识别子项集合的关键，需与ExcelFileModel中子项集合的属性名完全一致（大小写敏感）。
• 模型需实现INotifyPropertyChanged：确保属性值变化能同步到UI。
• 集合类型为ObservableCollection：ViewModel中的ExcelFiles需使用ObservableCollection<ExcelFileModel>，保证增删项时UI自动更新。

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