useAutoScroll
The useAutoScroll
hook is responsible for managing auto scroll. For example, when a new message arrive, message list will be auto scrolled to the bottom and the new arrived message will be visible.
Example Usage:
const listRef = useRef<FlatList>(null);
const { onContentSizeChangeHandler } = useAutoScroll({ ref: listRef });
return (
<FlatList
ref={listRef}
contentContainerStyle={{ flexGrow: 1 }}
data={messages}
renderItem={renderListItem}
keyExtractor={listItemKeyExtractor}
onContentSizeChange={onContentSizeChangeHandler}
/>
);
Hook Argument
ref
ref
Type | Default |
---|---|
Ref object of type Flatlist component Instance (Required) | No Default |
Hook Return Value
onContentSizeChangeHandler
onContentSizeChangeHandler
Type |
---|
Callback function of type: (width: number, height: number) => void |
Updated about 1 year ago
What’s Next