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

fix(all): docs for all missing props

Browse Source
This commit is contained in:
Manu Mtz.-Almeida
2018-10-11 16:02:15 -05:00
committed by Manu MA
parent 53305741a0
commit a72fced6fe
119 changed files with 1026 additions and 657 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -191,19 +191,22 @@ dataset, so please make sure they're performant.
| `domRender` | -- | | `DomRenderFn` |
| `footerFn` | -- | Section footers and the data used within its given template can be dynamically created by passing a function to `footerFn`. The logic within the footer function can decide if the footer template should be used, and what data to give to the footer template. The function must return `null` if a footer cell shouldn't be created. | `HeaderFn` |
| `headerFn` | -- | Section headers and the data used within its given template can be dynamically created by passing a function to `headerFn`. For example, a large list of contacts usually has dividers between each letter in the alphabet. App's can provide their own custom `headerFn` which is called with each record within the dataset. The logic within the header function can decide if the header template should be used, and what data to give to the header template. The function must return `null` if a header cell shouldn't be created. | `HeaderFn` |
| `itemHeight` | -- | | `ItemHeightFn` |
| `itemHeight` | -- | An optional function that maps each item within their height. When this function is provides, heavy optimizations and fast path can be taked by `ion-virtual-scroll` leading to massive performance improvements. This function allows to skip all DOM reads, which can be Doing so leads to massive performance | `ItemHeightFn` |
| `items` | -- | The data that builds the templates within the virtual scroll. It's important to note that when this data has changed, then the entire virtual scroll is reset, which is an expensive operation and should be avoided if possible. | `any[]` |
| `nodeRender` | -- | | `ItemRenderFn` |
| `renderFooter` | -- | | `(item: any, index: number) => any` |
| `renderHeader` | -- | | `(item: any, index: number) => any` |
| `renderItem` | -- | | `(item: any, index: number) => any` |
| `nodeRender` | -- | NOTE: only Vanilla JS API. | `ItemRenderFn` |
| `renderFooter` | -- | NOTE: only JSX API for stencil. Provide a render function for the footer to be rendered. Returns a JSX virtual-dom. | `(item: any, index: number) => any` |
| `renderHeader` | -- | NOTE: only JSX API for stencil. Provide a render function for the header to be rendered. Returns a JSX virtual-dom. | `(item: any, index: number) => any` |
| `renderItem` | -- | NOTE: only JSX API for stencil. Provide a render function for the items to be rendered. Returns a JSX virtual-dom. | `(item: any, index: number) => any` |
## Methods
### `markDirty(offset: number, len?: number) => void`
This method marks a subset of items as dirty, so they can be re-rendered. Items should be marked as
dirty any time the content or their style changes.
The subset of items to be updated can are specifing by an offset and a length.
#### Parameters
@ -220,7 +223,13 @@ Type: `void`
### `markDirtyTail() => void`
This method marks the tail the items array as dirty, so they can be re-rendered.
It's equivalent to calling:
```
* virtualScroll.markDirty(lastItemLen, items.length - lastItemLen);
* ```
#### Returns
@ -230,7 +239,7 @@ Type: `void`
### `positionForItem(index: number) => Promise<number>`
Returns the position of the virtual item at the given index.
#### Parameters

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

@ -97,15 +97,44 @@ export class VirtualScroll implements ComponentInterface {
* should be avoided if possible.
*/
@Prop() items?: any[];
/**
* An optional function that maps each item within their height.
* When this function is provides, heavy optimizations and fast path can be taked by
* `ion-virtual-scroll` leading to massive performance improvements.
*
* This function allows to skip all DOM reads, which can be Doing so leads
* to massive performance
*/
@Prop() itemHeight?: ItemHeightFn;
// JSX API
/**
* NOTE: only JSX API for stencil.
*
* Provide a render function for the items to be rendered. Returns a JSX virtual-dom.
*/
@Prop() renderItem?: (item: any, index: number) => any;
/**
* NOTE: only JSX API for stencil.
*
* Provide a render function for the header to be rendered. Returns a JSX virtual-dom.
*/
@Prop() renderHeader?: (item: any, index: number) => any;
/**
* NOTE: only JSX API for stencil.
*
* Provide a render function for the footer to be rendered. Returns a JSX virtual-dom.
*/
@Prop() renderFooter?: (item: any, index: number) => any;
// Low level API
/**
* NOTE: only Vanilla JS API.
*/
@Prop() nodeRender?: ItemRenderFn;
/** @internal */
@Prop() domRender?: DomRenderFn;
@Watch('itemHeight')
@ -147,11 +176,20 @@ export class VirtualScroll implements ComponentInterface {
this.updateVirtualScroll();
}
/**
* Returns the position of the virtual item at the given index.
*/
@Method()
positionForItem(index: number): Promise<number> {
return Promise.resolve(positionForIndex(index, this.cells, this.getHeightIndex()));
}
/**
* This method marks a subset of items as dirty, so they can be re-rendered. Items should be marked as
* dirty any time the content or their style changes.
*
* The subset of items to be updated can are specifing by an offset and a length.
*/
@Method()
markDirty(offset: number, len = -1) {
// TODO: kind of hacky how we do in-place updated of the cells
@ -193,6 +231,15 @@ export class VirtualScroll implements ComponentInterface {
this.scheduleUpdate();
}
/**
* This method marks the tail the items array as dirty, so they can be re-rendered.
*
* It's equivalent to calling:
*
* ```
* virtualScroll.markDirty(lastItemLen, items.length - lastItemLen);
* ```
*/
@Method()
markDirtyTail() {
if (this.items) {