如何将会话中的电子邮件添加到reactjs中的表单中

如何解决如何将会话中的电子邮件添加到reactjs中的表单中

我正在尝试让用户的电子邮件登录到我的react应用程序中，但是遇到了一些麻烦。

以上是我的会议来自cognito

下面是将我的数据添加到表单中的位置。 fetch（）数据已正确添加，但是我需要一种从cognito添加电子邮件的方法。

  componentDidMount() {
fetch("https://ezha2ns0bl.execute-api.ap-southeast-2.amazonaws.com/prod/userdata")
  .then(res => res.json())
  .then(
    (result) => {
      this.setState({
        firstname: result.Item.userFirstName,middlename: result.Item.userMiddleName,surname: result.Item.userLastName,city: result.Item.userCity,postcode: result.Item.userPostCode,state: result.Item.userState,email:,about: result.Item.userAbout,formfirstname: result.Item.userFirstName,formmiddlename: result.Item.userMiddleName,formsurname: result.Item.userLastName,formcity: result.Item.userCity,formpostcode: result.postcode,formstate: result.Item.userState,formabout: result.Item.userAbout,});
    },)

这是来自fetch（）的数据

Item    
userLastName    "Pearson"
userMiddleName  "A"
userEmail   "[e-mail]"
userType    "jobseeker"
userAbout   "I am Jane and I'm looking for a job"
userFirstName   "Jane"
userState   "VIC"
userPostcode    "3976"
userCity    "Melbourne"

现在，我希望我的电子邮件来自该会话，其余信息来自userdata。

我将如何实现？

解决方法

您需要将两个调用拆分为单独的函数，然后将它们添加为componentdidmount（）。这是状态更新将发生的地方。

  getFirstApi() {
fetch("https://ezha2ns0bl.execute-api.ap-southeast-2.amazonaws.com/prod/userdata")
  .then(res => res.json())
  .then(
    (result) => {
      this.setState({
        firstname: result.Item.userFirstName,middlename: result.Item.userMiddleName,surname: result.Item.userLastName,city: result.Item.userCity,postcode: result.Item.userPostcode,state: result.Item.userState,about: result.Item.userAbout,formfirstname: result.Item.userFirstName,formmiddlename: result.Item.userMiddleName,formsurname: result.Item.userLastName,formcity: result.Item.userCity,formpostcode: result.postcode,formstate: result.Item.userState,formabout: result.Item.userAbout,});
    },)


 }

  getSecondApi() {
    Auth.currentAuthenticatedUser().then((user) => {
      this.setState({email: user.attributes.email,formemail: user.attributes.email})
     // console.log('user email = ' + user.attributes.email):
    });
  }

  componentDidMount() {
    this.getFirstApi();
    this.getSecondApi();

  }