mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-09 08:09:32 +08:00
fix(overlays): triggerController warns about missing triggers (#26651)
This commit is contained in:
@ -30,6 +30,7 @@ import {
|
||||
eventMethod,
|
||||
prepareOverlay,
|
||||
present,
|
||||
createTriggerController,
|
||||
} from '../../utils/overlays';
|
||||
import { getClassMap } from '../../utils/theme';
|
||||
import { deepReady } from '../../utils/transition';
|
||||
@ -61,13 +62,13 @@ import { setCardStatusBarDark, setCardStatusBarDefault } from './utils';
|
||||
shadow: true,
|
||||
})
|
||||
export class Modal implements ComponentInterface, OverlayInterface {
|
||||
private readonly triggerController = createTriggerController();
|
||||
private gesture?: Gesture;
|
||||
private modalIndex = modalIds++;
|
||||
private modalId?: string;
|
||||
private coreDelegate: FrameworkDelegate = CoreDelegate();
|
||||
private currentTransition?: Promise<any>;
|
||||
private sheetTransition?: Promise<any>;
|
||||
private destroyTriggerInteraction?: () => void;
|
||||
private isSheetModal = false;
|
||||
private currentBreakpoint?: number;
|
||||
private wrapperEl?: HTMLElement;
|
||||
@ -236,8 +237,11 @@ export class Modal implements ComponentInterface, OverlayInterface {
|
||||
*/
|
||||
@Prop() trigger: string | undefined;
|
||||
@Watch('trigger')
|
||||
onTriggerChange() {
|
||||
this.configureTriggerInteraction();
|
||||
triggerChanged() {
|
||||
const { trigger, el, triggerController } = this;
|
||||
if (trigger) {
|
||||
triggerController.addClickListener(el, trigger);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
@ -318,17 +322,13 @@ export class Modal implements ComponentInterface, OverlayInterface {
|
||||
}
|
||||
|
||||
connectedCallback() {
|
||||
const { configureTriggerInteraction, el } = this;
|
||||
const { el } = this;
|
||||
prepareOverlay(el);
|
||||
configureTriggerInteraction();
|
||||
this.triggerChanged();
|
||||
}
|
||||
|
||||
disconnectedCallback() {
|
||||
const { destroyTriggerInteraction } = this;
|
||||
|
||||
if (destroyTriggerInteraction) {
|
||||
destroyTriggerInteraction();
|
||||
}
|
||||
this.triggerController.removeClickListener();
|
||||
}
|
||||
|
||||
componentWillLoad() {
|
||||
@ -363,32 +363,6 @@ export class Modal implements ComponentInterface, OverlayInterface {
|
||||
this.breakpointsChanged(this.breakpoints);
|
||||
}
|
||||
|
||||
private configureTriggerInteraction = () => {
|
||||
const { trigger, el, destroyTriggerInteraction } = this;
|
||||
|
||||
if (destroyTriggerInteraction) {
|
||||
destroyTriggerInteraction();
|
||||
}
|
||||
|
||||
const triggerEl = trigger !== undefined ? document.getElementById(trigger) : null;
|
||||
if (!triggerEl) {
|
||||
return;
|
||||
}
|
||||
|
||||
const configureTriggerInteraction = (trigEl: HTMLElement, modalEl: HTMLIonModalElement) => {
|
||||
const openModal = () => {
|
||||
modalEl.present();
|
||||
};
|
||||
trigEl.addEventListener('click', openModal);
|
||||
|
||||
return () => {
|
||||
trigEl.removeEventListener('click', openModal);
|
||||
};
|
||||
};
|
||||
|
||||
this.destroyTriggerInteraction = configureTriggerInteraction(triggerEl, el);
|
||||
};
|
||||
|
||||
/**
|
||||
* Determines whether or not an overlay
|
||||
* is being used inline or via a controller/JS
|
||||
|
||||
Reference in New Issue
Block a user