Как добавить электронное письмо из сеанса в форму в reactjs

#reactjs #amazon-cognito

#reactjs #amazon-когнито #amazon-cognito

Вопрос:

Я пытаюсь получить электронное письмо от пользователя, вошедшего в мое приложение 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   "testapi12@gmail.com"
userType    "jobseeker"
userAbout   "I am Jane and I'm looking for a job"
userFirstName   "Jane"
userState   "VIC"
userPostcode    "3976"
userCity    "Melbourne"
  

Теперь я хочу, чтобы мое электронное письмо пришло из сеанса, а остальная информация — из пользовательских данных.

Как бы я сделал так , чтобы это произошло ?

Комментарии:

1. Можете ли вы добавить полный пример (в тексте) того, как result выглядит ваш вопрос?

2. Нравится результат result.Item.userFirstName ?

3. Данные, которые возвращаются из вашей выборки.

4. Я добавил его в свою правку

Ответ №1:

Вам нужно разделить оба вызова на отдельные функции, а затем добавить к ним 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();

  }