🐛重写表格事件遇到扩展问题
- Dominant language
- TypeScript
- Stars
- 1.7k
- Forks
- 220
- PR merge metrics
- No merged PRs in 30d
Description
### 🏷 Version
| Package | Version |
| -------------- | ------- |
| @antv/s2 | |
| @antv/s2-react | |
| @antv/s2-vue | |
### Sheet Type
- [ ] PivotSheet
### 🖋 Description
重写表格事件遇到扩展问题。
```javascript
const s2Options = {
interaction: {
customInteractions: [
{
// 重写多选
key: InteractionName.DATA_CELL_MULTI_SELECTION,
interaction: CustomDataCellMulitSelection,
},
{
key: InteractionName.DATA_CELL_BRUSH_SELECTION,
interaction: CustomDataCellBrushSelection,
},
],
}
}
```
重写的CustomDataCellMulitSelection需要禁用系统内置的DataCellClick,如果不改写S2代码,则需要禁用代码:
```
interaction.addIntercepts([InterceptType.CLICK]);
```
但是S2在点击画布会调用resetState将intercepts重置,禁用的位置仅有bindEvents位置可以调用。系统DataCellClick在初始化的时候即会调用bindEvents,使用on函数进行监听的。所以在S2在root.ts中即使将其replace了但是改函数依然是生效的。
```javascript
const defaultInteractions = this.getDefaultInteractions();
defaultInteractions.forEach(({ key, interaction: Interaction, enable }) => {
if (enable !== false) {
this.interactions.set(key, new Interaction(this.spreadsheet)); // 该Interaction实际已经生效了。并没有被后续CustomInteractionClass替换。
}
});
if (!isEmpty(customInteractions)) {
forEach(customInteractions, (customInteraction: CustomInteraction) => {
const CustomInteractionClass = customInteraction.interaction;
this.interactions.set(
customInteraction.key,
new CustomInteractionClass(this.spreadsheet),
);
});
}
```
### ⌨️ Code Snapshots
### 🔗 Reproduce Link
### 🤔 Steps to Reproduce
### 😊 Expected Behavior
需要将调用bindEvents的时机调后,仅仅调用已经生效被复写的interactions即可。
```javascript
// root.ts
const defaultInteractions = this.getDefaultInteractions();
defaultInteractions.forEach(({ key, interaction: Interaction, enable }) => {
if (enable !== false) {
this.interactions.set(key, new Interaction(this.spreadsheet));
}
});
if (!isEmpty(customInteractions)) {
forEach(customInteractions, (customInteraction: CustomInteraction) => {
const CustomInteractionClass = customInteraction.interaction;
this.interactions.set(
customInteraction.key,
new CustomInteractionClass(this.spreadsheet),
);
});
}
this.interactions.forEach((interaction:BaseEvent)=>{
interaction.bindEvents();
})
...
```
```javascript
// base-event.ts
export abstract class BaseEvent {
public spreadsheet: SpreadSheet;
constructor(spreadsheet: SpreadSheet) {
this.spreadsheet = spreadsheet;
\\ this.bindEvents();
}
...
}
```
### 😅 Current Behavior
所以该代码时间无法进行内置的Click的重写。
### 💻 System information
Contributor guide
Assessment
This issue has not been assessed yet.