javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-18 19:21:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(virtual-scroll): deprecate virtual scroll in favor of JS framework solutions (#23854)

Browse Source
This commit is contained in:
Liam DeBeasi
2021-08-31 18:20:29 -04:00
committed by GitHub
parent 11fda41420
commit a0229bc7b2
2 changed files with 21 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
core/src/components/virtual-scroll/readme.md
View File

@ -7,6 +7,23 @@ consist of items, headers, and footers. For performance reasons, not every recor
in the list is rendered at once; instead a small subset of records (enough to fill the viewport)
are rendered and reused as the user scrolls.
This guide will go over the recommended virtual scrolling packages for each framework integration as well as documentation for the deprecated `ion-virtual-scroll` component for Ionic Angular. We recommend using the framework-specific solutions listed below, but the `ion-virtual-scroll` documentation is available below for developers who are still using that component.
## Angular
For virtual scrolling options in Ionic Angular, please see [Angular Virtual Scroll Guide](../angular/virtual-scroll).
## React
For virtual scrolling options in Ionic React, please see [React Virtual Scroll Guide](../react/virtual-scroll).
## Vue
For virtual scrolling options in Ionic Vue, please see [Vue Virtual Scroll Guide](../vue/virtual-scroll).
------
The following documentation applies to the `ion-virtual-scroll` component.
## Approximate Widths and Heights

4
core/src/components/virtual-scroll/virtual-scroll.tsx
View File

@ -153,6 +153,10 @@ export class VirtualScroll implements ComponentInterface {
this.updateVirtualScroll();
}
componentWillLoad() {
console.warn(`[Deprecation Warning]: ion-virtual-scroll has been deprecated and will be removed in Ionic Framework v7.0. See https://ionicframework.com/docs/angular/virtual-scroll for migration steps.`);
}
async connectedCallback() {
const contentEl = this.el.closest('ion-content');
if (!contentEl) {