Reference home > @af-utils/virtual-react > useSyncedStyles

useSyncedStyles() function

React hook. Optimal CSS markup for virtual scroll is not intuitive. Use this hook to avoid unneeded boilerplate.

Signature:

useSyncedStyles: (model: VirtualScroller) => [
    (outerRef: HTMLElement | null) => void,
    (innerRef: HTMLElement | null) => void
]

Parameters

Parameter

Type

Description

model

VirtualScroller

Returns

[ (outerRef: HTMLElement | null) => void, (innerRef: HTMLElement | null) => void ]

Array of two callback refs (for outer and inner elements).

Remarks

An example could be found here