javascript - 在屏幕上显示从 firebase 返回的数据

Question

我的 firebase 查询返回了数据，但我不知道如何在屏幕上显示。看看这段代码：

firestore.collection('profiledata').doc(userID).get().then(doc => console.log(doc.data()))}
         
        render(){
    return(
        <div className='profile'>
            <h1>User</h1>
            {
                this.state.profiledata && 
                    this.state.profiledata.map( profiledata => {
                        return(
                            <div>
                                <p>
                                    First Name
                                    Last Name 
                                    Company Name                        
                                    </p>
                            </div>
                            
                        )
                    })
            }
            </div>
    )
}

它说名字，姓氏，公司名称，我需要输出我从firestore.collection('profiledata').doc(userID).get().then(doc => console.log(doc.data()))}控制台中返回的用户的详细信息，它正在返回这个：

   {
    "lastname": "x",
    "firstname": "x",
    "companyname": "x"
}

如何将其输出到屏幕？谢谢 ：）

标签： javascriptreactjsfirebase

Answer 1

您只需要在您的状态下设置数据。

firestore.collection('profiledata').doc(userID).get().then(doc => this.setState({ profiledata: doc.data() }))}

以及映射数据的位置，您只需输出值

return (
  <div>
    <p>First Name: ${profiledata.firstname}</p>
    <p>Last Name: ${profiledata.lastname}</p>
    <p>Company Name: ${profiledata.companyname}</p>
  </div>
)