Estoy armando un componente que se supone que recupera a todos los usuarios de la base de datos, lo cual hace; el problema es que no se detiene y recupera datos de la base de datos sin cesar hasta que la aplicación falla y, como era de esperar, da el error en el título.

Aquí está el código en cuestión:

 const Dashboard = () => { const [usersList, setUsersList] = useState([]); const userRef = query(ref(db, '/Users')); onValue(userRef, (snapshot) => { let userlist = []; snapshot.forEach((snap) => { userlist.push(snap.toJSON()); }); setUsersList(userlist); }, { onlyOnce: true }); return( <div> {usersList.map(data => { return ( <div class="profile_info"> {data.name} </div> ); })} </div> ) }

Para reiterar, proporcionará una lista de nombres como se esperaba, pero después de unos momentos se bloqueará y mostrará el error "InternalError: too much recursion". He solucionado algunos problemas por mi cuenta antes de publicar la pregunta y lo he reducido al proceso de pegar todos los datos en una matriz temporal y luego configurar esa matriz en el estado responsable, pero todo lo que he visto en línea sobre esto El proceso parece indicar que esa es la forma correcta de hacer lo que estoy tratando de hacer, por lo que me siento atascado.