Skip to content

Commit

Permalink
docs(props): add get item layout
Browse files Browse the repository at this point in the history
  • Loading branch information
Marco Cesarato committed Jun 7, 2021
1 parent 0df13d1 commit 0f1f4a8
Showing 1 changed file with 24 additions and 0 deletions.
24 changes: 24 additions & 0 deletions docs/Props.md
Original file line number Diff line number Diff line change
Expand Up @@ -153,6 +153,8 @@ Rendered at the bottom of the list.

Specify the item height.

This is needed to have a great performance boost for lists of several thousands items.

| Type | Required | Default |
| ---------------- | -------- | ------- |
| number, function | Yes | `50` |
Expand Down Expand Up @@ -221,6 +223,28 @@ Specify the content inset.
| ------ | -------- | ------------------------------------------ |
| number | No | `{ top: 0, right: 0, left: 0, bottom: 0 }` |

### `getItemLayout`

```js
(data, index) => {length: number, offset: number, index: number}
```

`getItemLayout` is an optional optimization that allows skipping the measurement of dynamic content if you know the size (height or width) of items ahead of time. getItemLayout is efficient if you have fixed size items, for example:

```js
getItemLayout={(data, index) => (
{length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index}
)}
```

Adding getItemLayout can be a great performance boost for lists of several thousands items.

This is a **compatibility** prop for FlatList replacement and so it'll replace the `itemHeight` prop.

| Type | Required |
| -------- | -------- |
| function | No |

### `ListEmptyComponent`

Rendered when the list is empty. Can be a React Component (e.g. `SomeComponent`), or a React element (e.g. `<SomeComponent />`).
Expand Down

0 comments on commit 0f1f4a8

Please sign in to comment.