如何在 React 中使用 firebase 数据库答案

【问题标题】：How to use firebase database with React如何在 React 中使用 firebase 数据库
【发布时间】：2022-01-19 16:41:02
【问题描述】：

我第一次尝试在 React 应用程序上使用 firebase，但我在文档中找不到正确的程序。

那是我用于 firebase 的 config.js（当然我在这里隐藏了我的凭据）

// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
  apiKey: "*************************",
  authDomain: "****************",
  databaseURL: "**********************",
  projectId: "**********",
  storageBucket: "***************",
  messagingSenderId: "************",
  appId: "***************",
  measurementId: "***********"
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);

export default app;

在我的文件 App.js 中有这个：

import React, { useState, useEffect } from 'react';
import { useParams } from 'react-router';
import "./App.css";
import Message from "./components/Message";
import MessageEditor from "./components/MessageEditor";

import firebase from './config'

function App(){
  
  const [messages, setMessages] = useState({});
  const [pseudo, setPseudo] = useState(useParams().pseudo)


  useEffect(()=> {
    firebase.syncState('/', {
      context: this,
      state: 'messages'
    })
  })
}

在我得到的错误中，有一个告诉我 syncState 不是一个函数！

【问题讨论】：

你想使用 re-base 吗？我不认为普通的firebase有一个叫做syncState的函数，当我搜索syncState时会弹出re-base。 github.com/tylermcginnis/re-base
是的，一开始我确实使用了 re-base，但我删除了它，因为它似乎与最新版本的 firebase 不兼容，但后来我必须删除 syncState，谢谢

标签： reactjs firebase-realtime-database

【解决方案1】：

Firebase 没有名为 syncState 的函数。这就是您收到此错误的原因。

我认为你尝试使用 re-base:https://firebaseopensource.com/projects/tylermcginnis/re-base/。

但它还没有更新，所以我建议你只使用普通的 firebase 库。

1 设置：https://firebase.google.com/docs/web/setup

2 实时数据库设置：https://firebase.google.com/docs/database/web/start

【讨论】：