React Native Interactions
React Native InteractionManager helpers.
; { return <AfterInteractions> <ExpensiveComponent/> </AfterInteractions> ;}
Installation
npm i --save react-native-interactions
Usage
AfterInteractions
A component that only renders children
after InteractionManager.runAfterInteractions()
. Wrap top-level Navigator
scenes with this component to improve animation perfomance.
; { return <AfterInteractions placeholder=<CheapPlaceholder/>> <ExpensiveComponent/> </AfterInteractions> ;}
Props:
prop | type | default | description |
---|---|---|---|
placeholder |
react element | null |
(optional) prerendered placeholder content |
renderPlaceholder |
function | null |
(optional) placeholder renderer |
renderAfterInteractions
Same as AfterInteractions
component, but in the form of a decorator.
; @renderAfterInteractions static placeholder = <CheapPlaceholder/>; { // expensive stuff }
or:
@ // expensive stuff
or:
// expensive stuff ExpensiveComponent;
Options:
option | type | default | description |
---|---|---|---|
hoistStatics |
boolean | true |
(optional) copy non-react static props to composed component |
placeholder |
react element | null |
(optional) prerendered placeholder content |
renderPlaceholder |
function | null |
(optional) placeholder renderer |
License
MIT