透视表树模式是否可以支持展开/收起图标条件渲染?

[ggcfcmd]

🏷 Version

Package	Version
@antv/s2	1.54.7
@antv/s2-react	1.46.4
@antv/s2-vue

Sheet Type

• PivotSheet
• TableSheet
• GridAnalysisSheet
• StrategySheet
• EditableSheet

🖋 Description

当前使用s2-react透视表的树模式（hierarchyType: "tree"），希望部分行（如图中红色部分）可以禁用展开/收起功能，同时隐藏对应图标，是否有配置可以支持？

🔗 Reproduce Link

😊 Expected Behavior

希望图中红色行不展示图标

😅 Current Behavior

所有行都会展示图标

[Jinke Li]

红框的两个 icon 分别位于 角头和行头, 你可以自定义 cornerCell 和 rowCell, 请参考官网 https://s2.antv.antgroup.com/examples/custom/custom-cell/#custom-specified-cell

内部展开/收起的 icon 的判断是这个, 你可以重写 showTreeIcon, 根据 this.meta 之类的自行控制.

S2/packages/s2-core/src/cell/corner-cell.ts

Lines 199 to 205 in 8eeee82

 protected showTreeIcon() { 
   // 批量折叠或者展开的 icon，渲染在行头对应的角头中 
   return ( 
     this.spreadsheet.isHierarchyTreeType() && 
     this.meta.cornerType === CornerNodeType.Row 
   ); 
 } 

S2/packages/s2-core/src/cell/row-cell.ts

Lines 79 to 81 in 8eeee82

 protected showTreeIcon() { 
   return this.spreadsheet.isHierarchyTreeType() && !this.meta.isLeaf; 
 } 

class CustomCornerCell extends CornerCell {
  showTreeIcon() {
    // 你的逻辑
  }
}

class CustomRowCell extends RowCell {
  showTreeIcon() {
    // 你的逻辑
  }
}

[ggcfcmd]

红框的两个 icon 分别位于 角头和行头, 你可以自定义 cornerCell 和 rowCell, 请参考官网 https://s2.antv.antgroup.com/examples/custom/custom-cell/#custom-specified-cell

内部展开/收起的 icon 的判断是这个, 你可以重写 showTreeIcon, 根据 this.meta 之类的自行控制.

S2/packages/s2-core/src/cell/corner-cell.ts

Lines 199 to 205 in 8eeee82

 protected showTreeIcon() { 
   // 批量折叠或者展开的 icon，渲染在行头对应的角头中 
   return ( 
     this.spreadsheet.isHierarchyTreeType() && 
     this.meta.cornerType === CornerNodeType.Row 
   ); 
 } 

S2/packages/s2-core/src/cell/row-cell.ts

Lines 79 to 81 in 8eeee82

 protected showTreeIcon() { 
   return this.spreadsheet.isHierarchyTreeType() && !this.meta.isLeaf; 
 } 

class CustomCornerCell extends CornerCell {
  showTreeIcon() {
    // 你的逻辑
  }
}

class CustomRowCell extends RowCell {
  showTreeIcon() {
    // 你的逻辑
  }
}

感谢解答 目前还有两个问题 我现在使用树模式，重写CustomRowCell的逻辑如下

class CustomRowCell extends RowCell {
constructor(node, spreadsheet, headerConfig) {
super(node, spreadsheet, headerConfig);
}
showTreeIcon() {
// console.log('isHierarchyTreeType log: ', this.spreadsheet.isHierarchyTreeType(), 'meta log: ', this.meta)
return this.spreadsheet.isHierarchyTreeType() && !this.meta.isLeaf;
}
}

问题1：this.meta中的isLeaf始终为undefined，是有配置项控制么？
问题2：我尝试着通过判断meta中的children字段是否有值来判断叶子节点，但我发现当一个节点有子节点但没展开时，children字段是空的，展开节点时会动态更新children，是否有办法在初始情况下拿到有关完整树结构的配置？