javascript - 如何在屏幕上打印 firebase 的子参数的结果？

Question

如何在屏幕上打印我的 Firebase 子参数的结果？

错误:对象作为 React 子对象无效(发现:带有键 {datetime、extras、params} 的对象)。如果您打算渲染子集合，请改用数组。

constructor() {
    super()
    this.app = firebase.initializeApp(firebase_config);
    this.database = this.app.database().ref().child('users');
    this.state = {
      users: []
    }
}

componentDidMount() {
  this.database.once("value", snapshot => {
   snapshot.forEach(data => {
    data.forEach(result => {
      this.setState({users: result.val()})
    });
   })
 });
}

render() {
   return(
     <BrowserRouter>
       <div className="App">
         <Navbar/>
         <Switch>
          <Route exact="exact" path='/' component={CampaingListClients}/>
         </Switch>
        <p>{this.state.users}</p>
      </div>
   </BrowserRouter>
  );
 }
}

对象作为 React 子对象无效(找到:带有键 {datetime, extras, params} 的对象)。如果您打算渲染子集合，请改用数组。

我的 firebase 结构在这里:enter image description here

此处错误说明:enter image description here

Answer 1

你可以做这样的事情。

render() {
  const { users } = this.state;
  return (
   <BrowserRouter>
    <div className="App">
      <Navbar/>
      <Switch>
        <Route exact="exact" path='/' component={CampaingListClients}/>
      </Switch>
      <p>
        {users.map(user => {
          <span key={user.name}>
            <span>{user.name}</span>
            <span>{user.email}</span>
          </span>
        })}
      </p>
    </div>
  </BrowserRouter>
  );
}