TIL 27 Image Source 변수로 할당

React Native에서 Image를 지정할때 

 

<Image source={require('./myProfileImg.png')}/>

 

이런식으로 작성을 하는데 require함수 내부에서는 자바스크립트 변수가 적용이 안된다.

 

const myImageUrl = './myProfileImg.png'
<Image source={require({myImageUrl})}/>

 

위 코드처럼 리액트에서 사용하는 {}을 사용하면 계속해서 오류가 나온다.

그래서 해결책은 찾아보니 require('./myProfileImg.png')을 전체를 변수로 묶어버리면 해결이 가능하다.

 

const item =  {
      title: "Item 1",
      text: "Text 1",
      src: require("./event.jpeg"),
    },
  
  <Image source={item.src} />

 

이런식으로 접근을 해서 할당을 해주면 가능하다