fix: 修复 Popup 闭包问题 (#1495)

* feat: 修复 Popup 点击失效问题

* feat: 修复 Popup 点击失效问题

* refactor: 气泡 Popup 中的 closeOnClick 默认值改为 false

Co-authored-by: yanxiong <oujinhui.ojh@antgroup.com>
This commit is contained in:
heiyexing 2022-11-20 22:51:10 +08:00 committed by GitHub
parent bbff81c50c
commit 47f391687c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 9 additions and 14 deletions

View File

@ -86,7 +86,6 @@ export default class LayerPopup extends Popup<ILayerPopupOption> {
},
offsets: [0, 10],
closeButton: false,
closeOnClick: false,
autoClose: false,
closeOnEsc: false,
};

View File

@ -361,7 +361,7 @@ export default class Popup<O extends IPopupOption = IPopupOption>
// tslint:disable-next-line:no-object-literal-type-assertion
return {
closeButton: true,
closeOnClick: true,
closeOnClick: false,
maxWidth: '240px',
offsets: [0, 0],
anchor: anchorType.BOTTOM,
@ -391,10 +391,10 @@ export default class Popup<O extends IPopupOption = IPopupOption>
protected updateCloseOnClick(onlyClear?: boolean) {
const mapsService = this.mapsService;
if (mapsService) {
this.mapsService.off('click', this.onCloseButtonClick);
mapsService?.off('click', this.onCloseButtonClick);
if (this.popupOption.closeOnClick && !onlyClear) {
requestAnimationFrame(() => {
this.mapsService.on('click', this.onCloseButtonClick);
mapsService?.on('click', this.onCloseButtonClick);
});
}
}
@ -403,20 +403,16 @@ export default class Popup<O extends IPopupOption = IPopupOption>
protected updateCloseOnEsc(onlyClear?: boolean) {
window.removeEventListener('keydown', this.onKeyDown);
if (this.popupOption.closeOnEsc && !onlyClear) {
requestAnimationFrame(() => {
window.addEventListener('keydown', this.onKeyDown);
});
window.addEventListener('keydown', this.onKeyDown);
}
}
protected updateFollowCursor(onlyClear?: boolean) {
const container = this.mapsService?.getContainer();
if (container) {
container.removeEventListener('mousemove', this.onMouseMove);
container?.removeEventListener('mousemove', this.onMouseMove);
if (this.popupOption.followCursor && !onlyClear) {
requestAnimationFrame(() => {
container.addEventListener('mousemove', this.onMouseMove);
});
container?.addEventListener('mousemove', this.onMouseMove);
}
}
}

View File

@ -57,13 +57,13 @@ scene.on('loaded', () => {
## 配置
| 名称 | 说明 | 类型 | 默认值 |
| ------------------ | ------------------------------------------------------------------------ | -------------------------------------- | ---------- |
| 名称 | 说明 | 类型 | 默认值 |
| ------------------ | ------------------------------------------------------------------------ | -------------------------------------- |------------|
| lngLat | Popup 所在的经纬度 | `{ lng: number; lat: number }` | - |
| text | Popup 内容展示的文本内容 | `string` | - |
| html | Popup 内容展示的自定义 HTML可以传 HTML 字符串,也可以传 DOM 对象或数组 | `string | HTMLElement | HTMLElement[]` | - |
| title | Popup 标题展示的自定义 HTML可以传 HTML 字符串,也可以传 DOM 对象或数组 | `string | HTMLElement | HTMLElement[]` | - |
| closeOnClick | 点击地图区域时,是否关闭当前 Popup | `boolean` | `true` |
| closeOnClick | 点击地图区域时,是否关闭当前 Popup | `boolean` | `false` |
| closeOnEsc | 点击 Esc 键时,是否关闭当前 Popup | `boolean` | `false` |
| maxWidth | Popup 的最大宽度 | `string` | `240px` |
| anchor | Popup 箭头位置,可以控制 Popup 相对于经纬度点的展示位置 | [AnchorType](#anchortype) | `'bottom'` |