javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-22 13:32:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(queue): use stencil's queue controller for dom read/writes

Browse Source
This commit is contained in:
Adam Bradley
2018-04-11 15:24:49 -05:00
parent 6a31f3960a
commit d623b3b71f
17 changed files with 75 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
core/src/components/infinite-scroll/infinite-scroll.tsx
View File

@ -1,5 +1,5 @@
import { Component, Element, Event, EventEmitter, EventListenerEnable, Listen, Method, Prop, State, Watch } from '@stencil/core';
import { DomController } from '../../index';
import { QueueController } from '../../index';
const enum Position {
Top = 'top',
@ -22,7 +22,7 @@ export class InfiniteScroll {
@Element() private el: HTMLElement;
@State() isLoading = false;
@Prop({ context: 'dom' }) dom: DomController;
@Prop({ context: 'queue' }) queue: QueueController;
@Prop({ context: 'enableListener' }) enableListener: EventListenerEnable;
/**
@ -92,7 +92,7 @@ export class InfiniteScroll {
this.thresholdChanged(this.threshold);
this.enableScrollEvents(!this.disabled);
if (this.position === Position.Top) {
this.dom.write(() => this.scrollEl && this.scrollEl.scrollToBottom(0));
this.queue.write(() => this.scrollEl && this.scrollEl.scrollToBottom(0));
}
}
@ -179,14 +179,14 @@ export class InfiniteScroll {
const prev = scrollEl.scrollHeight - scrollEl.scrollTop;
// ******** DOM READ ****************
this.dom.read(() => {
this.queue.read(() => {
// UI has updated, save the new content dimensions
const scrollHeight = scrollEl.scrollHeight;
// New content was added on top, so the scroll position should be changed immediately to prevent it from jumping around
const newScrollTop = scrollHeight - prev;
// ******** DOM WRITE ****************
this.dom.write(() => {
this.queue.write(() => {
scrollEl.scrollTop = newScrollTop;
this.isBusy = false;
});