React Native component간에 데이터 주고받기

화면간 네비게이션을 구현했는데 문제가 생겼다...

https://codlingual.tistory.com/335

React Native navigation 화면 간 이동하기

 

각 component에서 react-native-async-storage를 이용해 데이터를 불러오는데 에러가 생겼다.

사실 expo QR 코드로 체크할 때만 해도 에러가 안 났는데 플레이스토어에 업데이트하니까 에러가 생겼다. 너무 슬펐다.......

스트레스 받아서 잠 못 이루다가 갑자기 async storage 없이 component간에 데이터를 주고 받으면 해결되지 않을까 싶어서 새벽 3시에 일어나서 이걸 했다...근데 결론은 잘 해결된 듯 ㅎㅎㅎㅎㅎ

아직도 왜 전의 코드가 에러 났는지 잘 모르겠지만 어쨌든 해결됐으니 됐다!!!

 

Home.js에서 Graph로 이동하는 코드다. 개구리 사진을 누르면 이동한다. 이때 전달하고 싶은 데이터를 딕셔너리 형태로 써주기만 하면 된다!! 

<TouchableOpacity onPress={() => this.props.navigation.navigate('Graph', {savings: this.state.savings});}> 
<Image source={require('./frog.png')} />
</TouchableOpacity>

 

이렇게 주면 Graph.js에선 다음과 같이 savings 데이터를 받아올 수 있다.

 

const savings = this.props.route.params.savings;