Как получить данные из массива объекта в JSON API? (React. js) - PullRequest
Новая
       17

Как получить данные из массива объекта в JSON API? (React. js)

0 голосов
/ 01 апреля 2020

Мне нужно получить данные из JSON API, но данные находятся в массиве с типом объекта. Данные содержат метку времени. Поэтому мне также нужно преобразовать его в формат времени в JavaScript.

, рассмотрите код ниже: 

  constructor(props) {
    super(props);

    this.state = {
      data: [],
    };

    this.commitChanges = this.commitChanges.bind(this);
  }

  componentDidMount(){
    // const loginEmail = localStorage.getItem('loginEmail');
    const id = localStorage.getItem('id');
    this.setState({id})

     fetch(`http://localhost:9000/api/calendar/list/${id}`,)
     .then((resp)=>{
       resp.json().then((res)=>{
         console.log(res.data)            // line 275
          console.log(typeof res.data)    // line 276
          console.log(res.data.title)     // line 277
          this.setState({
            data: [{
              title: res.data.title,
              startDate: new Date(res.data.startDate * 1000),
              endDate:  new Date(res.data.endDate * 1000),
            }]
         });
       })
     })

   }


render() {
    const { data } = this.state;
    console.log( data)    // line 311
    return (
      <Paper>
        <Scheduler
          data={data}    
        >
      </Paper>
    );
  }

Мой консольный журнал отвечает:

enter image description here

Моя проблема в том, что мне нужно преобразовать его из метки времени в JavaScript, но я не могу получить startDate и endDate из моего JSON API. Любой способ или решение, которое может получить заголовок, startDate и endDate из JSon API?

1 Ответ

2 голосов
/ 01 апреля 2020

Это довольно очевидно из вашего скриншота console.log. res.data это массив, а не простой объект. Это должно быть console.log(res.data[0].title). То же самое для setState, вы должны map поверх исходных данных: 

this.setState({
  data: res.data.map(item => {
    return {
      title: item.title,
      startDate: new Date(item.startDate * 1000),
      endDate: new Date(item.endDate * 1000),
    };
  })
});

Возможно, вы новичок в JS и одурачены typeof something === "object". Ну, массив в JS также является типом объекта. 

const plainObj = { foo: "bar" };
const arrayObj = [1];

console.log(typeof plainObj); // > "object"
console.log(typeof arrayObj); // > "object"

Правильный способ сделать это, используйте Array.isArray()

console.log(Array.isArray(plainObj)); // > false
console.log(Array.isArray(arrayObj)); // > true
...