How to use a Firestore query with realtime data in firebase 9 modular-CodePudding

I want to be able to use Realtime data with a specific query but I cannot find a way to insert the query inside of the Realtime logic ?

import { doc, onSnapshot } from "firebase/firestore";
import { query, orderBy, limit } from "firebase/firestore";  

const query = query(citiesRef, orderBy("name"), limit(3));

const unsub = onSnapshot(doc(db, "cities", "SF"), (doc) => {
  const source = doc.metadata.hasPendingWrites ? "Local" : "Server";
  console.log(source, " data: ", doc.data());
});

CodePudding user response：

You just need to pass the query in onSnapshot instead of that DocumentReference:

const query = query(citiesRef, orderBy("name"), limit(3));

const unsub = onSnapshot(query, (snap) => {
  
  console.log(" data: ", snap.docs.map(d => d.data());
});