react-native-interactions
Advanced tools
Weekly downloads
Readme
React Native InteractionManager helpers.
import {AfterInteractions} from 'react-native-interactions';
function MyComponent() {
return (
<AfterInteractions>
<ExpensiveComponent/>
</AfterInteractions>
);
}
npm i --save react-native-interactions
A component that only renders children
after InteractionManager.runAfterInteractions()
. Wrap top-level Navigator
scenes with this component to improve animation perfomance.
import {AfterInteractions} from 'react-native-interactions';
function MyScene() {
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 |
Same as AfterInteractions
component, but in the form of a decorator.
import {renderAfterInteractions} from 'react-native-interactions';
@renderAfterInteractions
class ExpensiveComponent extends Component {
static placeholder = <CheapPlaceholder/>;
render() {
// expensive stuff
}
}
or:
@renderAfterInteractions({placeholder: <CheapPlaceholder/>})
class ExpensiveComponent extends Component {
// expensive stuff
}
or:
class ExpensiveComponent extends Component {
// expensive stuff
}
export default renderAfterInteractions(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 |
MIT
FAQs
React Native InteractionManager helpers
The npm package react-native-interactions receives a total of 297 weekly downloads. As such, react-native-interactions popularity was classified as not popular.
We found that react-native-interactions demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket installs a Github app to automatically flag issues on every pull request and report the health of your dependencies. Find out what is inside your node modules and prevent malicious activity before you update the dependencies.