현재 상황
Screen에서 Modal로 이동할 때 해당 데이터 값을 넘겨줘야 하는 상황
이때 사용되는 state는 총 2개로
1. 모달을 열어주는 state
2. 데이터 값을 받는 state
이런 상황에서 값을 넘겨주는 방식은 2가지가 있다.
1. props로 전달
2. DeviceEventEmitter 사용
첫 번째 방식은 모달이 mount 됐을 때 상태 값을 2개를 관리해줘야해서 번거로운 반면,
두 번째 방식은 항상 모달이 listen중이니 2개의 state 관리가 필요 없고, 값을 전달 받을 수 있다.
Screen
import { DeviceEventEmitter } from 'react-native';
DeviceEventEmitter.emit('aaaa', data); // 넘기는 data
Modal
import { DeviceEventEmitter } from 'react-native';
useEffect(() => {
const subscription = DeviceEventEmitter.addListener(
'aaaa',
(data: string) => {
console.log(data); // data 넘겨 받기
},
);
return () => {
subscription.remove(); // 컴포넌트가 화면에서 사라지면 listener remove까지 해주자
};
}, []);
'React-Native' 카테고리의 다른 글
[react-native] error Failed to install the app. Make sure you have an Android emulator running or a device connected. (1) | 2023.05.18 |
---|---|
[react-native] 요즘 자주 사용하는 디자인 패턴 (0) | 2023.05.08 |
[React native] android 릴리즈 모드에서 network error (0) | 2023.02.24 |
[react-native] 앱 종료 시 BackHandler VS react-native-exit-app (0) | 2023.02.07 |
[React-Native] 그라데이션 적용 (0) | 2022.12.30 |