react-with-monitor
Installation
npm i react-native-buttonex
Usage
A monitor
function is injected into the wrapped component. Access it at this.monitor
. This function accepts a function, which gets two arguments, props
and state
. It returns a promise, which is resolved when the function returns truthy.
import withMonitor from 'react-with-monitor'
async function delay(ms) {
await new Promise(resolve => setTimeout(()=>resolve(), ms));
}
class LoadingDumb extends Component {
state = {
step: 0
}
componentDidMount() {
this.orchestrate();
}
render() {
const { isPreLoaded } = this.props;
return (
<View style={styles.screen}>
{ !isPreLoaded && <Image source={{ uri:'splash' }} style={{ width:144, height:144 }} /> }
</View>
)
}
async orchestrate() {
this.setState({ step: 1 });
const isStep1 = await this.monitor((props, state) => state.step === 1);
this.setState({ step: 2 });
await this.monitor((props, state) => state.step === 2);
}
}
const Loading = withMonitor(LoadingDumb)
export default Loading