react-native svg 이미지 가져오기

슬기로운 코딩생활·2021년 4월 30일
0

2021.04

목록 보기
13/13
{bodyType.map((data) => (
        <View>
          <Image sorce={{uri: data.imgUrl}} />
        </View>
      ))}

처음 svg 이미지를 가져오려고 위와 같이 했는데 이미지 파일이 로드가 안됐다...
왜 안되지 라는 생각으로 2일 동안 고민했는데 결국은 svg파일은 라이브러리 설치 후 로드 할 수 있다는 것을 알았다.

해결법

npm install react-native-svg 

일단 라이브러리 설치를 한다.
그리고 react처럼 바로 쓰면 좋겠지만 react-native의 경우 ios나 android나 과정이 한가지 더있다.
ios의 경우

pod install

android의 경우

npm run andriod

진짜 앱개발은 너무 어렵다...
이렇게 설치 후

import { SvgCssUri } from "react-native-svg";

<View>
   <SvgCssUri uri={data.imgUrl} />
</View>

위와 같이 해주면 이미지가 뿅 하고 나타날 것이다.

0개의 댓글