[React Native] 3. Cache Image for Pre-load

offdutybyblo·2021년 7월 28일
0

React Native

목록 보기
3/7
post-thumbnail

React Native : Prefetch Method

//import API
import { Image } from 'react-native';

//ex code
await Image.prefetch("url");
  • react native에서는 이미지를 미리 로드할 수 있도록 prefetch method를 제공한다.
  • 위의 코드처럼 url을 prefetch method로 넘겨주면 된다.

Expo : Asset API

//import
import { Asset } from 'expo-asset';


//from module
const imageURI = Asset.fromModule(require('./assets/snack-icon.png')).downloadAsync();

Asset Loading

위의 2가지 방법 모두 promise를 반환한다. 이 프로미스를 가지고 우리는 AppLoading에서 사용할 수 있다.

//프로미스를 반환하는 로직들을 모아서 한 번에 요청하는 로직이다. 배열 안 Promise가 모두 처리되면 새로운 Promise가 이행된다. 배열 안 Promise의 결괏값을 담은 배열이 새로운 Promise의 Result가 된다. 
return Promise.all([...images, ...fonts]);
profile
Front-End Devleoper 일껄요?

0개의 댓글