diff --git a/packages/s2-core/__tests__/unit/interaction/__snapshots__/row-column-resize-spec.ts.snap b/packages/s2-core/__tests__/unit/interaction/__snapshots__/row-column-resize-spec.ts.snap
index 67e7c97998..f836cf3c9f 100644
--- a/packages/s2-core/__tests__/unit/interaction/__snapshots__/row-column-resize-spec.ts.snap
+++ b/packages/s2-core/__tests__/unit/interaction/__snapshots__/row-column-resize-spec.ts.snap
@@ -20,7 +20,7 @@ Object {
"heightByField": null,
"maxLines": 1,
"textOverflow": "ellipsis",
- "width": null,
+ "width": undefined,
"widthByField": Object {
"testFieldId": 5,
},
@@ -34,7 +34,7 @@ Object {
"heightByField": null,
"maxLines": 1,
"textOverflow": "ellipsis",
- "width": null,
+ "width": undefined,
"widthByField": Object {
"testField": 5,
},
@@ -48,9 +48,10 @@ Object {
"heightByField": null,
"maxLines": 1,
"textOverflow": "ellipsis",
- "width": null,
+ "width": undefined,
"widthByField": Object {
- "testFieldId": 5,
+ "test-cell-a": 5,
+ "test-cell-b": 5,
},
"wordWrap": true,
}
@@ -62,7 +63,7 @@ Object {
"heightByField": null,
"maxLines": 1,
"textOverflow": "ellipsis",
- "width": null,
+ "width": undefined,
"widthByField": Object {
"test-cell-a": 5,
"test-cell-b": 5,
@@ -73,7 +74,7 @@ Object {
exports[`Interaction Row Column Resize Tests should get multiple vertical filed resize style by field for selected resize type 1`] = `
Object {
- "height": null,
+ "height": undefined,
"heightByField": Object {
"test-cell-a": 2,
"test-cell-b": 2,
@@ -123,7 +124,7 @@ Object {
exports[`Interaction Row Column Resize Tests should get vertical filed resize style by field for current resize type 1`] = `
Object {
- "height": null,
+ "height": undefined,
"heightByField": Object {
"testFieldId": 2,
},
@@ -137,9 +138,10 @@ Object {
exports[`Interaction Row Column Resize Tests should get vertical filed resize style by field for selected resize type 1`] = `
Object {
- "height": null,
+ "height": undefined,
"heightByField": Object {
- "testFieldId": 2,
+ "test-cell-a": 2,
+ "test-cell-b": 2,
},
"maxLines": 1,
"showTreeLeafNodeAlignDot": false,
@@ -163,6 +165,20 @@ Object {
}
`;
+exports[`Interaction Row Column Resize Tests should not effect default resize style by field for selected resize type 1`] = `
+Object {
+ "height": 30,
+ "heightByField": null,
+ "maxLines": 1,
+ "textOverflow": "ellipsis",
+ "width": 50,
+ "widthByField": Object {
+ "testFieldId": 5,
+ },
+ "wordWrap": true,
+}
+`;
+
exports[`Interaction Row Column Resize Tests should rerender by resize col cell 1`] = `
Object {
"height": 30,
diff --git a/packages/s2-core/__tests__/unit/interaction/row-column-resize-spec.ts b/packages/s2-core/__tests__/unit/interaction/row-column-resize-spec.ts
index 49d0664cda..a1e069dd0e 100644
--- a/packages/s2-core/__tests__/unit/interaction/row-column-resize-spec.ts
+++ b/packages/s2-core/__tests__/unit/interaction/row-column-resize-spec.ts
@@ -160,10 +160,12 @@ describe('Interaction Row Column Resize Tests', () => {
s2.hideTooltip = jest.fn();
s2.interaction.reset = jest.fn();
s2.interaction.getActiveRowCells = () => [
- createMockCellInfo('test-row-cell').mockCell,
+ createMockCellInfo('test-row-cell-a').mockCell,
+ createMockCellInfo('test-row-cell-b').mockCell,
];
s2.interaction.getActiveColCells = () => [
- createMockCellInfo('test-col-cell').mockCell,
+ createMockCellInfo('test-col-cell-a').mockCell,
+ createMockCellInfo('test-col-cell-b').mockCell,
];
// 模拟多选
@@ -823,6 +825,10 @@ describe('Interaction Row Column Resize Tests', () => {
},
});
+ jest
+ .spyOn(s2.interaction, 'isSelectedState')
+ .mockImplementationOnce(() => true);
+
emitResize(ResizeDirectionType.Horizontal, ResizeAreaEffect.Cell);
expect(s2.options.style!.colCell).toMatchSnapshot();
@@ -839,6 +845,10 @@ describe('Interaction Row Column Resize Tests', () => {
},
});
+ jest
+ .spyOn(s2.interaction, 'isSelectedState')
+ .mockImplementationOnce(() => true);
+
emitResize(ResizeDirectionType.Vertical, ResizeAreaEffect.Cell);
expect(s2.options.style!.rowCell).toMatchSnapshot();
@@ -895,4 +905,25 @@ describe('Interaction Row Column Resize Tests', () => {
expect(s2.options.style!.colCell).toMatchSnapshot();
});
+
+ // https://github.com/antvis/S2/issues/2910
+ test('should not effect default resize style by field for selected resize type', () => {
+ s2.setOptions({
+ style: {
+ colCell: {
+ width: 50,
+ },
+ },
+ interaction: {
+ resize: {
+ rowResizeType: ResizeType.CURRENT,
+ colResizeType: ResizeType.CURRENT,
+ },
+ },
+ });
+
+ emitResize(ResizeDirectionType.Horizontal, ResizeAreaEffect.Cell);
+
+ expect(s2.options.style!.colCell).toMatchSnapshot();
+ });
});
diff --git a/packages/s2-core/src/interaction/row-column-resize.ts b/packages/s2-core/src/interaction/row-column-resize.ts
index 0d63ba518e..c0f0bbf8bc 100644
--- a/packages/s2-core/src/interaction/row-column-resize.ts
+++ b/packages/s2-core/src/interaction/row-column-resize.ts
@@ -303,8 +303,8 @@ export class RowColumnResize extends BaseEvent implements BaseEventImplement {
// 非多选: 正常设置即可
if (
- !this.isEffectRowOf(ResizeType.SELECTED) ||
- !this.isEffectColOf(ResizeType.SELECTED) ||
+ (!this.isEffectRowOf(ResizeType.SELECTED) &&
+ !this.isEffectColOf(ResizeType.SELECTED)) ||
!isMultiSelected
) {
return {
@@ -360,7 +360,9 @@ export class RowColumnResize extends BaseEvent implements BaseEventImplement {
eventType: S2Event.LAYOUT_RESIZE_COL_WIDTH,
style: {
colCell: {
- width: !this.isEffectColOf(ResizeType.ALL) ? null : displayWidth,
+ width: !this.isEffectColOf(ResizeType.ALL)
+ ? undefined
+ : displayWidth,
widthByField: this.getCellStyleByField(displayWidth),
},
},
@@ -398,7 +400,7 @@ export class RowColumnResize extends BaseEvent implements BaseEventImplement {
style: {
rowCell: {
height: !this.isEffectRowOf(ResizeType.ALL)
- ? null
+ ? undefined
: displayHeight,
heightByField: this.getCellStyleByField(displayHeight),
},
diff --git a/s2-site/docs/common/interaction.zh.md b/s2-site/docs/common/interaction.zh.md
index 0a614389c7..209fbac516 100644
--- a/s2-site/docs/common/interaction.zh.md
+++ b/s2-site/docs/common/interaction.zh.md
@@ -68,8 +68,8 @@ interface ScrollSpeedRatio {
| cornerCellHorizontal | 是否开启角头水平方向 resize 热区 | `boolean` | true | |
| colCellHorizontal | 是否开启列头水平方向 resize 热区 | `boolean` | true | |
| colCellVertical | 是否开启列头垂直方向 resize 热区 （列头隐藏时该配置无效） | `boolean` | true | |
-| rowResizeType | 用于控制行高 resize 时的生效范围
1. `all`: 对所有单元格生效，2. `current`: 对当前单元格生效，3. `selected`: 对当前单元格生效，如果单元格是多选状态，调整任意选中单元格，对所有选中的生效。| `all`\| `current` \| `selected` | `current` | |
-| colResizeType | 用于控制列宽 resize 时的生效范围
1. `all`: 对所有单元格生效，2. `current`: 对当前单元格生效，3. `selected`: 对当前单元格生效，如果单元格是多选状态，调整任意选中单元格，对所有选中的生效。| `all`\| `current` \| `selected` | `current` | |
+| rowResizeType | 用于控制行高 resize 时的生效范围
1. `all`: 对所有单元格生效（会覆盖默认的行高配置），2. `current`: 对当前单元格生效，3. `selected`: 对当前单元格生效，如果单元格是多选状态，调整任意选中单元格，对所有选中的生效。| `all`\| `current` \| `selected` | `current` | |
+| colResizeType | 用于控制列宽 resize 时的生效范围
1. `all`: 对所有单元格生效（会覆盖默认的列宽配置），2. `current`: 对当前单元格生效，3. `selected`: 对当前单元格生效，如果单元格是多选状态，调整任意选中单元格，对所有选中的生效。| `all`\| `current` \| `selected` | `current` | |
| disable | 用于控制行高 resize 是否生效。[查看示例](/examples/interaction/advanced/#resize-disable) | (resizeInfo: [S2CellType](/docs/api/components/sheet-component#resizeinfo)) => boolean | | |
| visible | 自定义当前单元格是否显示 resize 热区 | (cell: [S2CellType](/docs/api/basic-class/base-cell)) => boolean | | |
| minCellWidth | 单元格可拖拽最小宽度 | `number`| 20 | |