title: How do i set up a listener for a firestore document?
body: <p>I am making a chat with Ionic and react using firestore as my database. I am storing all the messages in an array <code>[]</code> in a document in firestore. And simply want both users to fetch the data again if a message is added. So i basically want to add a listener to my document. My chat is working but you have to reload the page to see new messages... This is my code:</p>
  
  <pre><code>const [chats, setChats] = useState([]);
  
      db.collection("chats").doc(chatId).onSnapshot((doc) =&gt; {
  
                  setChats(doc.data().messages)
  
              });
  </code></pre>
  
  <p>I either i get infinite loops or doc.data() is not defined. Is there a good way to fetch data using this function? Or do you need for example firebase cloud functions?</p>