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>
  );
}

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

1 个答案: