Javascript 如何显示id为React Js和Firebase的数据

我正在做一个项目，我想显示我的firebase数据库中的一些数据

我可以显示其中的一些，但我想在一个框中显示“ListClient”的其余数据，该框链接到带有id的复选框

listClients.js它是我从数据库映射数据的地方

import React, { Component } from "react";
import * as firebase from "firebase";
import { Table, InputGroup } from "react-bootstrap";
class ListClients extends React.Component {
  state = {
    loading: true
  };

  componentWillMount() {
    const ref = firebase.database().ref("listClients");
    ref.on("value", snapshot => {
      this.setState({ listClients: snapshot.val(), loading: false });
    });
  }

  render() {
    if (this.state.loading) {
      return <h1>Chargement...</h1>;
    }

    const clients = this.state.listClients.map((client, i) => (
      <tr key={i}>
        <td>
          <input id={client.id} type="checkbox" onChange={this.cbChange} />
        </td>
        <td>{client.nom}</td>
        <td>{client.prenom}</td>
      </tr>
    ));
    const clientsAdresses = this.state.listClients.map((clientAdresse, i) => (
      <tr key={i}>
        <td id={clientAdresse.id}>{clientAdresse.adresse}</td>
      </tr>
    ));

    return (
      <>
        <Table className="ContentDesign" striped bordered hover>
          <thead>
            <tr>
              <th></th>

              <th>First Name</th>
              <th>Last Name</th>
            </tr>
          </thead>
          <tbody>{clients}</tbody>
        </Table>

        <Table className="ContentDesign" striped bordered hover>
          <thead>
            <tr>
              <th>Adresse : </th>
            </tr>
          </thead>


          <tbody>{clientsAdresses}</tbody>


        </Table>
      </>
    );
  }
}

export default ListClients;

我的数据：

我只想要复选框选中的id的“地址”

多谢各位

错误：

---

要从数据库中检索地址，请使用以下代码：

componentWillMount() {
const ref = firebase.database().ref("listClients");
    ref.on("value", snapshot => {
       snapshot.forEach((subSnap) => {
      let address = subSnap.val().adresse;
      });
    });
  }

首先添加对节点

listClients

的引用，使用

forEach

可以迭代并检索

adrese

---

如果要根据id获取

地址

，则可以使用查询：

const ref = firebase.database().ref("listClients").orderByChild("id").equalTo(0);

---

选中此项您正在显示一个对象请尝试显示一个值，例如

快照。key

我可以显示此值，但只能在console.log上显示，我不知道如何在h1上显示例如阅读此项也很好谢谢，它正在工作，我显示每个地址，但是现在，当我点击一个收音机按钮时，我只想要检查收音机的区域。错误是另一个问题。当您尝试在React中显示对象时，会出现该错误。在尝试显示之前，您需要将响应分离。为了跟踪检查内容，谷歌“受控组件”，看看这是否有帮助：

const ref = firebase.database().ref("listClients").orderByChild("id").equalTo(0);