如何从firebase获取文档名？

Question

我使用这个组件将数据推送出去，但是我无法从数据库中获取文档名，即CloudFunctionMonitor下的“CloudFunctionMonitor”(请见图)并显示它。

​

​

docRef.id不工作，我不是在寻找ID，而是查找子文档的实际名称？

            <Card.Content>
              <Card.Header>{this.props.cloudFunction.docRef.id}</Card.Header>
              <Card.Description>{}</Card.Description>
            </Card.Content>

完整代码index.js：

import "../../App";
import "semantic-ui-css/semantic.min.css";
import { Icon, Card, Button } from "semantic-ui-react";
import "semantic-ui-css/semantic.min.css";
import React, { Component } from "react";
import "semantic-ui-css/semantic.min.css";

export default class Cards extends Component {
  render() {
    return (
      <Card color="green">
        <Card.Content>
          <Card.Header>{this.props.cloudFunction.docRef.id}</Card.Header>
          <Card.Description>{}</Card.Description>
        </Card.Content>
        <Card.Content extra>
          <Icon name="cog" /> Records: {this.props.cloudFunction.lastRunLoad}
          <br />
          <Icon name="cog" />
          {this.props.cloudFunction.lastRunMessage}
          <br />
          <Icon name="clock" /> Last Run:{" "}
          {this.props.cloudFunction.lastRunTime.toDate().toString()}
          <br />
          <Icon name="angle double down" />
          Schedule: {this.props.cloudFunction.schedule}
        </Card.Content>
        <Card.Content extra>
          <div className="ui two buttons">
            <Button basic color="green">
              Cloud Function
            </Button>
          </div>
        </Card.Content>
      </Card>
    );
  }
}

固定查询

useEffect(() => {
  const unsubscribe = FirestoreService.getCloudFunctionItems(
    (querySnapshot) => {
      const updatedCloundFunctions = querySnapshot.docs.map(
        (docSnapshot) => ({
          guid: uuidV4(),
          ...docSnapshot.data(),
        })
      );
      console.log(updatedCloundFunctions);
      setCloudFunctions(updatedCloundFunctions);
    },
    (error) => setError("list-item-get-fail")
  );
  return unsubscribe;
}, []);

Answer 1

文档数据不包含其ID。您必须显式地添加它，如下所示：

const updatedCloundFunctions = querySnapshot.docs.map((docSnapshot) => ({
    guid: uuidV4(),
    // Add Document ID
    id: docSnapshot.id
    ...docSnapshot.data(),
  })
);

然后您可以通过this.props.cloudFunction.id访问它。