fix(refresher): ios native refresher now works in side menu (#22449)

This commit is contained in:
Liam DeBeasi
2020-11-10 12:07:38 -05:00
committed by GitHub
parent e17c822bfb
commit a4a64530ff

View File

@ -165,7 +165,7 @@ export class Refresher implements ComponentInterface {
private async setupiOSNativeRefresher(pullingSpinner: HTMLIonSpinnerElement, refreshingSpinner: HTMLIonSpinnerElement) { private async setupiOSNativeRefresher(pullingSpinner: HTMLIonSpinnerElement, refreshingSpinner: HTMLIonSpinnerElement) {
this.elementToTransform = this.scrollEl!; this.elementToTransform = this.scrollEl!;
const ticks = pullingSpinner.shadowRoot!.querySelectorAll('svg'); const ticks = pullingSpinner.shadowRoot!.querySelectorAll('svg');
const MAX_PULL = this.scrollEl!.clientHeight * 0.16; let MAX_PULL = this.scrollEl!.clientHeight * 0.16;
const NUM_TICKS = ticks.length; const NUM_TICKS = ticks.length;
writeTask(() => ticks.forEach(el => el.style.setProperty('animation', 'none'))); writeTask(() => ticks.forEach(el => el.style.setProperty('animation', 'none')));
@ -251,6 +251,18 @@ export class Refresher implements ComponentInterface {
if (!this.didRefresh) { if (!this.didRefresh) {
translateElement(this.elementToTransform, '0px'); translateElement(this.elementToTransform, '0px');
} }
/**
* If the content had `display: none` when
* the refresher was initialized, its clientHeight
* will be 0. When the gesture starts, the content
* will be visible, so try to get the correct
* client height again. This is most common when
* using the refresher in an ion-menu.
*/
if (MAX_PULL === 0) {
MAX_PULL = this.scrollEl!.clientHeight * 0.16;
}
}, },
onMove: ev => { onMove: ev => {
this.lastVelocityY = ev.velocityY; this.lastVelocityY = ev.velocityY;