sap.ui.table.TreeTable：如何设置特定行复选框不可见？

要实现TreeTable中特定行隐藏或禁用复选框，你不能直接修改默认的选择列（因为默认列是全局控制所有行的），最可靠的方式是自定义选择列模板，通过数据绑定来控制每行复选框的可见性或启用状态。下面是具体的实现步骤和代码示例：

步骤1：给数据模型添加控制属性 #

首先，在你的JSON数据中为每个节点新增一个属性（比如showCheckbox），用来标记该行是否需要显示复选框：

const oData = {
  items: [
    {
      name: "item1",
      showCheckbox: true,
      items: [
        { name: "subitem1-1", showCheckbox: false },
        { name: "subitem1-2", showCheckbox: false }
      ]
    },
    {
      name: "item2",
      showCheckbox: true,
      items: [
        { name: "subitem2-1", showCheckbox: false }
      ]
    }
  ]
};

步骤2：自定义TreeTable的选择列 #

不要依赖TreeTable默认的selectionMode来生成复选框，而是手动添加一个列，在列的模板中使用sap.m.CheckBox，并绑定它的visible（或enabled）属性到我们新增的showCheckbox字段，同时绑定selected属性来同步表格的选择状态：

sap.ui.getCore().attachInit(function() {
  sap.ui.require([
    "sap/ui/table/TreeTable",
    "sap/ui/table/Column",
    "sap/ui/model/json/JSONModel",
    "sap/m/CheckBox"
  ], function(TreeTable, Column, JSONModel, CheckBox) {
    // 初始化模型
    const oModel = new JSONModel(oData);
    
    // 创建TreeTable
    const oTreeTable = new TreeTable({
      rows: {
        path: "/items",
        parameters: {
          treeAnnotationProperties: {
            hierarchyLevel: "level",
            hierarchyNodeFor: "parentId"
          }
        }
      },
      // 注意：不要设置默认的selectionMode，我们用自定义列实现选择逻辑
      columns: [
        // 自定义选择列
        new Column({
          hAlign: "Center",
          width: "3rem",
          template: new CheckBox({
            visible: "{showCheckbox}", // 绑定可见性到数据字段
            selected: {
              path: "selected",
              mode: "TwoWay" // 双向绑定，同步选中状态到模型
            },
            select: function(oEvent) {
              // 手动同步选中状态到模型（可选，若需要后续业务逻辑使用选中数据）
              const oRowContext = oEvent.getSource().getBindingContext();
              oRowContext.getModel().setProperty(oRowContext.getPath() + "/selected", oEvent.getParameter("selected"));
            }
          })
        }),
        // 其他业务列
        new Column({
          label: "Item Name",
          template: "{name}"
        })
      ]
    });
    
    oTreeTable.setModel(oModel);
    oTreeTable.placeAt("content");
  });
});

额外说明 #

• 如果只是需要禁用复选框（而非隐藏），可以把visible换成enabled: "{showCheckbox}"，这样复选框会显示但无法交互。
• 若要保留TreeTable的批量选择、表头复选框等默认行为，可以结合selectionChange事件和模型数据做同步，但自定义模板的方式灵活性更高，能精准控制每一行的状态。
• 确保模型是双向绑定模式，这样复选框的选中状态能正确同步到数据中，方便后续业务逻辑调用。

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