Firebase 'collection' 未從 'firebase/firestore' 導出

Question

我試圖在我的項目中導入“集合”，但我只在“集合”上遇到此錯誤。 我遵循了有關查詢的 firebase 文檔，但我不知道如何解決它。

反應：

import { query, where, getDocs, collection } from "firebase/firestore";

  const [username, setUsername] = useState("")
  const [utente, setUtente] = useState(null)
  const [err, setErr] = useState(false)
  const handleSearch = async () =>{
  const q = query(collection(db, "users"), where("displayName", "==", username)
  );
  const querySnapshot = await getDocs(q);
  querySnapshot.forEach((doc) => {
  // doc.data() is never undefined for query doc snapshots
  console.log(doc.id, " => ", doc.data());
});};

  const handleKey = e=>{
    e.code === "Enter" && handleSearch();
  };

Package.json：

{
  "name": "whatsapp-clone",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@emotion/react": "^11.10.4",
    "@emotion/styled": "^11.10.4",
    "@material-ui/core": "^4.11.4",
    "@material-ui/icons": "^4.11.2",
    "@mui/material": "^5.10.5",
    "compressorjs": "^1.0.7",
    "emoji-picker-react": "^3.6.2",
    "firebase": "^8.6.3",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-firebase-hooks": "^3.0.4",
    "react-router-dom": "^5.2.0",
    "react-scripts": "4.0.3",
    "react-scrollable-feed": "^1.3.1",
    "uuid": "^8.3.2"
  },

非常感謝你提前

Answer 1

您正在使用 Firebase 8.6.3但從v9.0.0開始引入了模塊化語法。 升級到最新版本應該可以解決問題：

npm i firebase@latest

您也可以使用當前版本的命名空間語法，但我建議升級並使用新版本。