fix: 解决移动端下，树形结构展开、收起交互失效的问题。

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

@@ -24,6 +24,7 @@ import {
   getResizeAreaAttrs,
   shouldAddResizeArea,
 } from '../utils/interaction/resize';
+import { isMobile } from '../utils/is-mobile';
 import { HeaderCell } from './header-cell';
 
 export class CornerCell extends HeaderCell<CornerHeaderConfig> {
@@ -55,6 +56,11 @@ export class CornerCell extends HeaderCell<CornerHeaderConfig> {
     this.update();
   }
 
+  private onTreeIconClick(isCollapsed: boolean) {
+    this.spreadsheet.facet.resetScrollY();
+    this.spreadsheet.emit(S2Event.ROW_CELL_ALL_COLLAPSED__PRIVATE, isCollapsed);
+  }
+
   /**
    * 绘制折叠展开的 icon
    */
@@ -73,23 +79,37 @@ export class CornerCell extends HeaderCell<CornerHeaderConfig> {
       values(collapseFields!).filter(Boolean).length === rootRowNodes.length ||
       rootRowNodes.every((node) => node.isCollapsed);
     const isCollapsed = isAllCollapsed;
+    let offsetXY = 0;
+    let offsetWH = 0;
+
+    // 移动端的时候，将icon变化，从而增加触发交互的面积
+    if (isMobile()) {
+      offsetXY = size / 4;
+      offsetWH = size / 2!;
+    }
 
     this.treeIcon = renderTreeIcon({
       group: this,
       iconCfg: {
-        x: area.x,
-        y: this.getIconPosition().y,
-        width: size,
-        height: size,
+        x: area.x - offsetXY,
+        y: this.getIconPosition().y - offsetXY,
+        width: size + offsetWH,
+        height: size + offsetWH,
         fill,
       },
       isCollapsed,
       onClick: () => {
-        this.spreadsheet.facet.resetScrollY();
-        this.spreadsheet.emit(
-          S2Event.ROW_CELL_ALL_COLLAPSED__PRIVATE,
-          isCollapsed,
-        );
+        if (isMobile()) {
+          return;
+        }
+
+        this.onTreeIconClick(isCollapsed);
+      },
+      onTouchEnd: () => {
+        /**
+         * 移动端时，绑定展开、收起事件
+         */
+        this.onTreeIconClick(isCollapsed);
       },
     });
   }

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

@@ -155,28 +155,48 @@ export class RowCell extends HeaderCell<RowHeaderConfig> {
 
     const iconX = x + contentIndent;
     const iconY = this.getIconPosition().y;
+    let offsetXY = 0;
+    let offsetWH = 0;
+
+    // 移动端的时候，将icon变化，从而增加触发交互的面积
+    if (isMobile()) {
+      offsetXY = size / 4;
+      offsetWH = size / 2!;
+    }
 
     this.treeIcon = renderTreeIcon({
       group: this,
       iconCfg: {
-        x: iconX,
-        y: iconY,
-        width: size!,
-        height: size!,
+        x: iconX - offsetXY,
+        y: iconY - offsetXY,
+        width: size + offsetWH,
+        height: size + offsetWH,
         fill,
       },
       isCollapsed,
       onClick: () => {
         this.onTreeIconClick();
       },
+      onTouchEnd: () => {
+        /**
+         * 移动端时，绑定展开、收起事件
+         */
+        this.emitCollapseEvent();
+      },
     });
 
+    /**
+     * 这里不能将整个单元格作为热区
+     * 否则会导致emitCollapseEvent回调执行两次，
+     * 还会影响到绑定到整个单元格的其他事件，比如ToolTop.show
+     * 树形结构的展开、收起操作，在移动端下失效
+     */
     // 移动端, 点击热区为整个单元格
-    if (isMobile()) {
-      this.addEventListener('click', () => {
-        this.emitCollapseEvent();
-      });
-    }
+    // if (isMobile()) {
+    //   this.addEventListener('click', () => {
+    //     this.emitCollapseEvent();
+    //   });
+    // }
   }
 
   protected drawTreeLeafNodeAlignDot() {

packages/s2-core/src/utils/g-renders.ts

@@ -130,8 +130,9 @@ export function renderTreeIcon(options: {
   isCollapsed?: boolean | null;
   iconCfg: Omit<GuiIconCfg, 'name'>;
   onClick?: () => void;
+  onTouchEnd?: () => void;
 }) {
-  const { group, iconCfg, isCollapsed, onClick } = options;
+  const { group, iconCfg, isCollapsed, onClick, onTouchEnd } = options;
   const iconShape = renderIcon(group, {
     ...iconCfg,
     name: isCollapsed ? 'Plus' : 'Minus',
@@ -142,5 +143,9 @@ export function renderTreeIcon(options: {
     iconShape.addEventListener('click', onClick);
   }
 
+  if (isFunction(onTouchEnd)) {
+    iconShape.addEventListener('touchend', onTouchEnd);
+  }
+
   return iconShape;
 }