推送和对象数组到 Firebase - TypeScript

在 TypeScript 中，Firebase 是一个非常有用的云存储平台，可以用来存储和管理各种类型的数据。本篇文章将介绍如何推送和对象数组到 Firebase 中。我们将使用 Firebase SDK 来操作 Firebase 数据库，并使用 TypeScript 来编写我们的应用程序。

环境设置

在开始之前，我们需要安装 Firebase SDK 和 TypeScript。您可以使用以下命令安装 Firebase 和 TypeScript：

npm install --save firebase @firebase/app-types @firebase/firestore-types
npm install --save-dev typescript ts-node

安装完成后，我们需要创建一个 Firebase 应用程序和一个 Firebase 数据库。在您的 Firebase 控制台中，选择“添加项目”按钮，并按照屏幕上的说明创建一个 Firebase 项目。创建完成后，您将在控制台中看到您的 Firebase 项目的详细信息。

接下来，您需要创建一个 Firebase 数据库。在 Firebase 控制台中，选择“数据库”选项卡，并按照屏幕上的说明创建一个新的 Firestore 数据库。在创建过程中，您可以选择该库的规则（安全性）等级。

在创建 Firebase 应用程序和 Firebase 数据库后，您需要配置 Firebase SDK。在您的项目目录中，创建一个 firebase.ts 文件，并将以下代码添加到其中：

import * as firebase from "firebase/app";
import "firebase/firestore";

const firebaseConfig = {
  apiKey: "YOUR_API_KEY",
  authDomain: "YOUR_AUTH_DOMAIN",
  projectId: "YOUR_PROJECT_ID",
  storageBucket: "YOUR_STORAGE_BUCKET",
  messagingSenderId: "YOUR_MESSAGING_SENDER_ID",
  appId: "YOUR_APP_ID",
};

firebase.initializeApp(firebaseConfig);
const db = firebase.firestore();

export { firebase, db };

请将 YOUR_API_KEY、YOUR_AUTH_DOMAIN、YOUR_PROJECT_ID、YOUR_STORAGE_BUCKET、YOUR_MESSAGING_SENDER_ID 和 YOUR_APP_ID 替换为您的 Firebase 配置信息。

推送数据到 Firebase

现在，我们已经设置好了环境，可以开始推送数据到 Firebase。我们将使用 add() 方法向我们的 Firebase 数据库中添加新文档。以下是一个示例：

import { db } from "./firebase";

interface Person {
  name: string;
  age: number;
  occupation: string;
}

const personData: Person = {
  name: "John Doe",
  age: 30,
  occupation: "Engineer",
};

db.collection("persons")
  .add(personData)
  .then((docRef) => {
    console.log("Document written with ID: ", docRef.id);
  })
  .catch((error) => {
    console.error("Error adding document: ", error);
  });

在上面的示例中，我们定义了一个 Person 接口来描述每个文档的结构。我们使用 add() 方法将 personData 添加到名为 “persons” 的 Firestore 集合中。然后，我们使用 .then() 捕获文档引用并打印其 ID。如果出现错误，则使用 .catch() 方法捕获错误并打印其详细信息。

推送对象数组到 Firebase

推送对象数组到 Firebase 与推送单个对象非常相似。我们可以使用 add() 方法将整个对象数组添加到集合中。以下是一个示例：

interface Person {
  name: string;
  age: number;
  occupation: string;
}

const personsData: Person[] = [
  { name: "John Doe", age: 30, occupation: "Engineer" },
  { name: "Jane Doe", age: 25, occupation: "Teacher" },
  { name: "Bob Smith", age: 40, occupation: "Designer" },
];

personsData.forEach((person) => {
  db.collection("persons")
    .add(person)
    .then((docRef) => {
      console.log("Document written with ID: ", docRef.id);
    })
    .catch((error) => {
      console.error("Error adding document: ", error);
    });
});

在上面的示例中，我们定义了一个 Person 接口来描述每个文档的结构。然后，我们使用 forEach() 方法循环遍历人员数据数组，并将每个人员数据项添加到集合中。最后，我们使用 .then() 和 .catch() 方法捕获文档引用或错误并打印其详细信息。

结论

在本篇文章中，我们学习了如何推送和对象数组到 Firebase 中，并使用 TypeScript 编写了我们的应用程序。我们使用 add() 方法将数据添加到我们的集合中，并使用 .then() 和 .catch() 方法捕获响应或错误。

Firebase SDK 提供了强大的工具来简化数据存储和管理。使用 TypeScript，我们可以更轻松地编写可维护的应用程序，并且可以通过类型检查来减少常见的错误和错误。

希望这篇文章对学习 Firebase 和 TypeScript 有所帮助。