How to render react native component in the background? I want a splash screen, but the current example only allows async downloading data.
I have tried SplashScreen of AppLoading in Expo, but it only allows to download data first, it doesn't allow for async render for components.
import React from 'react';
import { Image, Text, View } from 'react-native';
import { Asset, SplashScreen } from 'expo';
export default class App extends React.Component {
state = {
isReady: false,
};
componentDidMount() {
SplashScreen.preventAutoHide();
}
render() {
if (!this.state.isReady) {
return (
<View style={{ flex: 1 }}>
<Image
source={require('./assets/images/splash.gif')}
onLoad={this._cacheResourcesAsync}
/>
</View>
);
}
return (
// ...
);
}
_cacheResourcesAsync = async () => {
SplashScreen.hide();
// ....
await Promise.all(cacheImages);
this.setState({ isReady: true });
}
}
This only download data asynchronously, but I want to render asynchronously.