Как сохранить данные ответа ios GET как json или как полученный ответ - PullRequest
Новая
       4

Как сохранить данные ответа ios GET как json или как полученный ответ

1 голос
/ 28 февраля 2020 
export class LoadProfile extends Component {
    state = {
    data: ''
   }

componentDidMount() {
    axios({
        url: 'http://localhost:8080/profile/all',
        method: 'GET',
        responseType: 'json',
      }).then((response) => {
        // here I can iterate all response data.
        response.data.forEach((d) => {
           console.log("d: "+d.displayName)
        });
        // here I am setting sate. Later I can't iterate this data any more 
        this.setState(response.data);
      });

   }
 }

Позже в методе рендеринга, когда я попытался сделать следующее: 

this.state.data.forEach((el) => {
    console.log("el: "+el.displayName)
})

Я получил ошибку как TypeError: this.state.data.forEach не является функцией

В этом случай, это был JSON формат. Как сохранить ответ, полученный от сервера, или сохранить в объекте JSON, чтобы повторить его позже?

Обновлен вопрос с полным кодом: - 

export class LoadProfile extends Component {

state = {
    data: ''
}

componentDidMount() {
    axios({
        url: 'http://localhost:8080//profile/all',
        method: 'GET',
        responseType: 'json',
      }).then((response) => {

        this.setState({data: response.data});

        response.data.forEach((d) => {
           console.log("d: "+d.displayName)
        });
        // this is fine
        this.state.data.forEach((e) => {
           console.log("e: "+e.displayName) 
        });
      });
}

render() {
    return (
    <Table singleLine>
    <Table.Header>
      <Table.Row>
        <Table.HeaderCell>Id</Table.HeaderCell>
        <Table.HeaderCell>Fullname</Table.HeaderCell>
        <Table.HeaderCell>Birth Date</Table.HeaderCell>
        <Table.HeaderCell>Gender</Table.HeaderCell>
      </Table.Row>
    </Table.Header>

    <Table.Body>
       // Here error: TypeError: this.state.data.forEach is not a function
      {this.state.data.forEach((el) => {
        return (
          <Table.Row key={el.id}>
            <Table.Cell>{el.id}</Table.Cell>
            <Table.Cell>
              {el.displayName}
            </Table.Cell>
            <Table.Cell>{el.birthDate}</Table.Cell>
            <Table.Cell>{el.gender}</Table.Cell>
          </Table.Row>
        );
      })
      }
    </Table.Body> 
  </Table>

    )
}
 }

 export default LoadProfile

Так что я могу повторять только внутри метода ответа ax ios. Но я не могу перебрать метод рендеринга. Что не так?

Ответы [ 2 ]

1 голос
/ 28 февраля 2020

Вы забыли ключ для состояния: 

 this.setState({ data: response.data });

Вы также должны установить начальное состояние как пустой массив, чтобы начальный рендер мог найти функцию карты (используйте map, а не forEach, forEach делает ничего не делать с возвращаемым значением): 

  state = {
    data: []
   }

this.state.data.map((el) => {
        return (
          <Table.Row key={el.id}>
            <Table.Cell>{el.id}</Table.Cell>
            <Table.Cell>
              {el.displayName}
            </Table.Cell>
            <Table.Cell>{el.birthDate}</Table.Cell>
            <Table.Cell>{el.gender}</Table.Cell>
          </Table.Row>
        );
      })
0 голосов
/ 28 февраля 2020

сделать это вместо 

this.setState({data: response.data});
...