바르고 뜨겁게

ReactNative - Assets PreLoad 세팅 본문

자바스크립트/React Native

ReactNative - Assets PreLoad 세팅

RightHot 2019. 6. 18. 00:58

ReactNative - Assets PreLoad 세팅


App.js

 import React from 'react';
 import { AppLoading } from "expo";
 import * as Font from "expo-font";
 import { Ionicons } from "@expo/vector-icons";
 import { StyleSheet, Text, View } from 'react-native';
 
 export default class App extends React.Component {
   state = {
     loaded: false
  };
 
   handleError = error => console.log(error); // 에러 핸들러
 
   handleLoaded = () => this.setState({ loaded: true }); // 로딩 끝난 뒤
 
   // 성공시 handleLoaded 호출
   // 실패시 handleError 호출
   loadAssets = async () => {
     await Font.loadAsync({
       ...Ionicons.font
    });
  };
 
   render() {
     const { loaded } = this.state;
     if (loaded) {
       return (
         <View style={styles.container}>
           <Text>Open up App.js to start working on your app!</Text>
         </View>
      );
    } else {
       return (
         <AppLoading
           startAsync={this.loadAssets}
           onFinish={this.handleLoaded}
           onError={this.handleError}
         />
      );
    }
  }
 }
 
 const styles = StyleSheet.create({
   container: {
     flex: 1,
     backgroundColor: '#fff',
     alignItems: 'center',
     justifyContent: 'center',
  },
 });
 


Comments