mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-23 05:58:26 +08:00
chore(): add show-modal in component not in animation (#20833)
resolves #20827
This commit is contained in:
@ -27,7 +27,6 @@ export const iosEnterAnimation = (
|
|||||||
.addElement(baseEl)
|
.addElement(baseEl)
|
||||||
.easing('cubic-bezier(0.32,0.72,0,1)')
|
.easing('cubic-bezier(0.32,0.72,0,1)')
|
||||||
.duration(500)
|
.duration(500)
|
||||||
.beforeAddClass('show-modal')
|
|
||||||
.addAnimation([backdropAnimation, wrapperAnimation]);
|
.addAnimation([backdropAnimation, wrapperAnimation]);
|
||||||
|
|
||||||
if (presentingEl) {
|
if (presentingEl) {
|
||||||
|
@ -28,6 +28,5 @@ export const mdEnterAnimation = (baseEl: HTMLElement): Animation => {
|
|||||||
.addElement(baseEl)
|
.addElement(baseEl)
|
||||||
.easing('cubic-bezier(0.36,0.66,0.04,1)')
|
.easing('cubic-bezier(0.36,0.66,0.04,1)')
|
||||||
.duration(280)
|
.duration(280)
|
||||||
.beforeAddClass('show-modal')
|
|
||||||
.addAnimation([backdropAnimation, wrapperAnimation]);
|
.addAnimation([backdropAnimation, wrapperAnimation]);
|
||||||
};
|
};
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { Component, ComponentInterface, Element, Event, EventEmitter, Host, Method, Prop, h } from '@stencil/core';
|
import { Component, ComponentInterface, Element, Event, EventEmitter, Host, Method, Prop, h, writeTask } from '@stencil/core';
|
||||||
|
|
||||||
import { config } from '../../global/config';
|
import { config } from '../../global/config';
|
||||||
import { getIonMode } from '../../global/ionic-global';
|
import { getIonMode } from '../../global/ionic-global';
|
||||||
@ -144,6 +144,9 @@ export class Modal implements ComponentInterface, OverlayInterface {
|
|||||||
};
|
};
|
||||||
this.usersElement = await attachComponent(this.delegate, container, this.component, ['ion-page'], componentProps);
|
this.usersElement = await attachComponent(this.delegate, container, this.component, ['ion-page'], componentProps);
|
||||||
await deepReady(this.usersElement);
|
await deepReady(this.usersElement);
|
||||||
|
|
||||||
|
writeTask(() => this.el.classList.add('show-modal'));
|
||||||
|
|
||||||
await present(this, 'modalEnter', iosEnterAnimation, mdEnterAnimation, this.presentingElement);
|
await present(this, 'modalEnter', iosEnterAnimation, mdEnterAnimation, this.presentingElement);
|
||||||
|
|
||||||
const mode = getIonMode(this);
|
const mode = getIonMode(this);
|
||||||
|
Reference in New Issue
Block a user