如何在 Kendo Blazor TreeList 元素中獲取一棵樹？

Question

我有一個 TechDocBranch 項目列表，我想將它們表示為Kendo Blazor TreeList 中的一棵樹。

public class TechDocBranch
{
    public long ID { get; set; }
    public long ParentID { get; set; }
    public string Title { get; set; }

    // some another fields
}

我寫了以下代碼：

<TelerikTreeList Data="@TechDocBranches"
                 IdField="@nameof(TechDocBranch.ID)"
                 ParentIdField="@nameof(TechDocBranch.ParentID)">
    <TreeListColumns>
        <TreeListColumn Field="@nameof(TechDocBranch.ID)"></TreeListColumn>
        <TreeListColumn Field="@nameof(TechDocBranch.Title)"></TreeListColumn>
        <TreeListColumn Field="@nameof(TechDocBranch.ParentID)"></TreeListColumn>
    </TreeListColumns>
</TelerikTreeList>

@code {
    public List<TechDocBranch> TechDocBranches;

    protected override async Task OnInitializedAsync()
    {
        TechDocBranches = await ProductionService.GetTechDocBranches();
    }
}

但它給了我一個簡單的表格，而不是一棵樹。 我嘗試使用 TreeView（僅更改了 html）：

<TelerikTreeView Data="@TechDocBranches">
    <TreeViewBindings>
        <TreeViewBinding 
                         IdField="@nameof(TechDocBranch.ID)" 
                         TextField="@nameof(TechDocBranch.Title)" 
                         ParentIdField="@nameof(TechDocBranch.ParentID)">
        </TreeViewBinding>
    </TreeViewBindings>
</TelerikTreeView>

它工作正常並給了我樹。

我應該怎么做才能在 TreeList 中獲取樹？

Answer 1

您必須為任何列添加可擴展屬性才能解決此問題。 例如：

<TreeListColumn Field="@nameof(TDB.ID)" Expandable="true"></TreeListColumn>

PS 請注意，與 Kendo TreeView 不同的是，Kendo TreeList 在數據量較大的情況下工作速度較慢。 （Blazor 2.18 版）