diff --git a/core/src/components.d.ts b/core/src/components.d.ts index 2787a2bb6b0..5b43d3cde2a 100644 --- a/core/src/components.d.ts +++ b/core/src/components.d.ts @@ -801,6 +801,7 @@ declare global { export interface IonContentAttributes extends HTMLAttributes { forceOverscroll?: boolean; fullscreen?: boolean; + scrollEnabled?: boolean; scrollEvents?: boolean; } } diff --git a/core/src/components/content/content.tsx b/core/src/components/content/content.tsx index d8a6f676af7..1d362b402cc 100644 --- a/core/src/components/content/content.tsx +++ b/core/src/components/content/content.tsx @@ -34,6 +34,7 @@ export class Content { */ @Prop() forceOverscroll: boolean; + @Prop() scrollEnabled = true; @Prop() scrollEvents = false; @@ -58,6 +59,9 @@ export class Content { */ @Method() scrollToTop(duration = 300) { + if (!this.scrollEl) { + throw new Error('content is not scrollable'); + } return this.scrollEl.scrollToTop(duration); } @@ -69,16 +73,25 @@ export class Content { */ @Method() scrollToBottom(duration = 300) { + if (!this.scrollEl) { + throw new Error('content is not scrollable'); + } return this.scrollEl.scrollToBottom(duration); } @Method() scrollByPoint(x: number, y: number, duration: number, done?: Function): Promise { + if (!this.scrollEl) { + throw new Error('content is not scrollable'); + } return this.scrollEl.scrollByPoint(x, y, duration, done); } @Method() scrollToPoint(x: number, y: number, duration: number, done?: Function): Promise { + if (!this.scrollEl) { + throw new Error('content is not scrollable'); + } return this.scrollEl.scrollToPoint(x, y, duration, done); } @@ -129,13 +142,15 @@ export class Content { this.resize(); return [ - this.scrollEl = el as any} - mode={this.mode} - scrollEvents={this.scrollEvents} - forceOverscroll={this.forceOverscroll}> - - , + (this.scrollEnabled) + ? this.scrollEl = el as any} + mode={this.mode} + scrollEvents={this.scrollEvents} + forceOverscroll={this.forceOverscroll}> + + + :
, ]; } diff --git a/core/src/components/content/readme.md b/core/src/components/content/readme.md index 4ef9272ad0a..581ba66ceab 100644 --- a/core/src/components/content/readme.md +++ b/core/src/components/content/readme.md @@ -34,6 +34,11 @@ and footers. This effect can easily be seen by setting the toolbar to transparent. +#### scrollEnabled + +boolean + + #### scrollEvents boolean @@ -59,6 +64,11 @@ and footers. This effect can easily be seen by setting the toolbar to transparent. +#### scroll-enabled + +boolean + + #### scroll-events boolean