TreeView 项目随机出现在错误的 parent 下

Question

编辑 2： 根据 Peter Duniho 的建议，我将用一个更简单的示例替换问题的原始文本和对原始代码的引用。

我正在开发 WinUI 3 应用程序。主要 window 有一个 TreeView，层次结构如下：top-level 项目是 CarMake 类型，每个 CarMake 可以有 0 个或更多 CarModel children。 window 有一个名为 Cars 的 ObservableCollection<CarMake> 属性，它是顶级 CarMake 的来源，每个 CarMake 都有一个 ObservableCollection<CarModel> 属性 CarModels 其 children 在 TreeView.

中的来源

这里分别是 CarMakeView 和 CarModelView 类型的 XAML 定义：

<StackPanel Orientation="Horizontal"
            Padding="12"
            x:Class="Cars.View.CarMakeView"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    
    <TextBlock Text="{x:Bind CarMake.Name}" VerticalAlignment="Center" />

</StackPanel>

<StackPanel Orientation="Horizontal"
    x:Class="Cars.View.CarModelView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    
    <TextBlock Text="{x:Bind Path=CarModel.Name}" />
    
</StackPanel>

CarMake.cs 和 CarModel.cs:

namespace Cars.Model
{
    public class CarMake
    {
        public string? Name { get; set; }
        public ObservableCollection<CarModel> CarModels { get; set; } = new();
    }
}

namespace Cars.Model
{
    public class CarModel
    {
        public string? Name { get; set; }
    }
}

这是 MainWindow 的 XAML。

<Window
<!-- imports etc. -->
>
    <Grid>
        <Grid.Resources>
                        
            <DataTemplate x:Key="CarMakeTemplate" x:DataType="model:CarMake">
                <TreeViewItem ItemsSource="{x:Bind CarModels}">
                    <viewModel:CarMakeView CarMake="{Binding}"/>
                </TreeViewItem>
            </DataTemplate>
            
            <DataTemplate x:Key="CarModelTemplate" x:DataType="model:CarModel">
                <TreeViewItem>
                    <viewModel:CarModelView CarModel="{Binding}"/>
                </TreeViewItem>
            </DataTemplate>
            
            <utility:CarItemSelector
                x:Key="CarItemSelector"
                CarMakeTemplate="{StaticResource CarMakeTemplate}"
                CarModelTemplate="{StaticResource CarModelTemplate}" />
        </Grid.Resources>
        
        
        <TextBlock/>
        <TreeView Grid.Row="1" ItemsSource="{x:Bind Cars}"  
                  ItemTemplateSelector="{StaticResource CarItemSelector}">
        </TreeView>
    </Grid>
    
</Window>

最后是 MainWindow 的 code-behind。请注意，我使用 CarMake 的 hard-coded 集合初始化了 Cars 属性，每个集合都关联了 CarModel。这定义了我们期望在 UI:

中看到的数据层次结构

public sealed partial class MainWindow : Window
{
    public ObservableCollection<CarMake> Cars { get; set; } =
        new ()
        {
            new CarMake { Name = "Chevrolet", CarModels = { new CarModel { Name = "Camaro" }, new CarModel { Name = "Blazer" }, new CarModel { Name = "Beretta" } } },
            new CarMake { Name = "Land Rover", CarModels = { new CarModel { Name = "Discovery" }, new CarModel { Name = "LR3" }, new CarModel { Name = "Range Rover" } } },
            new CarMake { Name = "Quadra", CarModels = { new CarModel { Name = "Turbo-R 740" }, new CarModel { Name = "Type-66 Avenger" }} },
            new CarMake { Name = "Powell Motors", CarModels = { new CarModel { Name = "The Homer" }}}
        };

    public MainWindow()
    {
        this.InitializeComponent();
    }
}

这是我的预期：在 UI 中，汽车模型应该出现在它们在代码中分配给的汽车品牌的视觉范围内 children .因此，例如，“The Homer”，而且只有“The Homer”，应该出现在“Powell Motors”的 children 中。

问题所在：启动应用程序并展开和折叠至少一个汽车品牌项目后，汽车模型开始显示在错误的汽车品牌下方。例如，“The Homer”车型可能出现在“Chevrolet”下，而不是“Powell Motors”下。每次折叠然后展开 top-level 汽车制造项目时，其下方会出现一组全新的汽车模型，apparent 随机来自其邻居。这几乎就像 UI 框架只是在玩弄 CarModel 并将它们粘在任何 CarMake 感觉之下，而不是尊重数据定义的层次结构。

我想知道的：我需要更改什么才能使车型名称仅出现在 [=80= 中指定的 parent 下]？另外，我想了解导致此问题的原因。

我知道 WinUI 3 现在绝对是最前沿的，所以我希望它是框架中的一个错误，而不是我做过的事情。我试图包含我认为与该问题相关的所有代码，但以防万一问题出在其他地方 here's a link to the GitHub repo - 它非常少，仅足够的代码来说明问题，并且只需几秒钟即可构建 Visual Studio.

Answer 1

我真的不明白为什么这会有所不同，但解决方案原来是在 CarModelView 的 [=14= 上更改 x:Bind 的 Mode ] Text 为 OneWay，而不是将其保留为默认值 OneTime:

<StackPanel Orientation="Horizontal"
    x:Class="Cars.View.CarModelView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    
    <TextBlock Text="{x:Bind Path=CarModel.Name, Mode=OneWay}" />
    
</StackPanel>

Edit：正如 Peter Duniho 在下面指出的那样，Microsoft 确实记录了 OneTime 是 {x:Bind} here 的默认模式，尽管为什么 OneTime 会导致我观察到的奇怪行为，这对我来说仍然是个谜。但无论如何，这至少似乎可以保证汽车名称始终准确出现在预期的位置，而绝不会出现在它们不在的位置。

TreeView 项目随机出现在错误的 parent 下

TreeView items randomly appear under the wrong parent

c#

xaml

uwp

treeview

winui-3