Dongwon Choi

안녕하세요.&nbsp;
제가 해결한 방법에 대해서 설명드리겠습니다.
저는 react-firebase-hooks라는 패키지를 설치해서 사용했습니다.
<pre class="language-javascript"><code>import { useList } from 'react-firebase-hooks/database'

const [snapshots, loading, error] = useList(chatRoomsRef);

...
...


<ul style={{ listStyleType: 'none', padding: 0}}>
 {!loading && snapshots &&
 snapshots.map((snapshot, key) => (
 <li key={key}>
 # {snapshot.val().name}
 </li>
 ))}
</ul></code></pre>

다음과 같이 작성하면 함수형 컴포넌트로도 채팅방을 볼 수 있습니다.
<a href="https://www.npmjs.com/package/react-firebase-hooks" target="_blank" rel="noopener noreferrer">참고 레퍼런스</a>

Dongwon Choi

Posts