React Native에서는 실시간 Firebase 텍스트 필드가 변경된 후 새 값이 표시되지 않습니다.

Question

React Native로 코딩 중인데 Google Firebase 라이브에서 값을 가져와야 합니다. 값(1)을 얻을 수 있지만 데이터베이스의 값이 변경되면 응용 프로그램의 텍스트 상자가 이에 따라 변경되지 않습니다(2). 즉, 데이터베이스와의 실시간 동기화가 구현되지 않습니다. 이유를 알 수 없습니다. 이 문제를 해결하는 데 도움을 주실 수 있나요? 매우 감사합니다! 제가 작성한 코드는 다음과 같습니다.

으아아아

Google Firebase에서 실시간으로 값을 가져와야 하고, 데이터베이스에서 값이 변경되면 텍스트 상자에서도 값을 변경해야 합니다.

Answer 1

이는 데이터가 Firebase(및 거의 모든 최신 클라우드 API)에서 비동기식으로 로드되고 <Text style={styles.text}>{Data}</Text>가 실행될 때 아직 사용할 수 없기 때문입니다.

원하는 것:

1. 구성 요소 상태로 데이터를 저장하세요
2. 상태가 변경되면 구성 요소를 다시 렌더링하도록 ReactJS에 지시하세요

이 작업을 수행하는 일반적인 방법은 useState and useEffect후크를 사용하는 것입니다.

으아아아

이것은 매우 복잡한 주제이므로 여기에 사용된 두 가지 후크를 모두 읽어보고 다음을 참조하는 것이 좋습니다.

• React useState 내에서 사용될 때 Firebase 데이터가 정의되지 않습니다(매우 유사함)
• Firebase | Firebase에서 데이터를 읽으면 "정의되지 않음"이 반환되지만 console.log에는 정확한 결과가 표시됩니다(구독 취소 방법도 보여줌)
• Firebase 응답이 너무 느립니다
• React 함수 클래스에서 useEffect를 사용하여 Firebase에 데이터 쓰기