Заполните карту reactjs объектами json из ответа на запрос внутри цикла - PullRequest
Новая
       4

Заполните карту reactjs объектами json из ответа на запрос внутри цикла

0 голосов
/ 13 марта 2020

Я работаю над панелью управления React и обнаружил библиотеку, которая помогает мне построить линейную диаграмму с использованием объекта json.

Так что я пытаюсь получить 7 объектов из моих запросов GET внутри a для l oop и залейте ими карту data.

Это объект json, который я получаю: 

{
  "year": "2020-03-03",
  "uses": 0
}

Я хочу иметь подобный объект : 

data = [
  {
    year: 2014,uses: 255,
  }, {
    year: 2016,uses: 250,
  }, {
    year: 2018,uses: 540,
  },
];

Я пытаюсь заполнить карту данных внутри componentWillMount() примерно так: 

constructor(props) {
  super(props);
  this.state = {
    data ,
  };
}

componentWillMount(){
  for (let i = 0; i < 7; i++) {
    axios.get("http://localhost:5000/transfer/getUsesByDay/"+i).then(
      res => {
        console.log("http://localhost:5000/transfer/getUsesByDay/"+i)
        console.log(res.data)
        //TODO : set state => Fill Data
      }
    )
  }
}

1 Ответ

2 голосов
/ 13 марта 2020

Вам следует использовать Promise.all, чтобы дождаться разрешения всех ответных обещаний, а затем попытаться обновить состояние сразу. 

componentWillMount() {
  let responses = []
    for (let i = 0; i < 7; i++) {
      responses.push(axios.get("http://localhost:5000/transfer/getUsesByDay/"+i))
    }

  Promise.all(responses).then(results => {
    this.setState(prevState => {
      return {
            data: [...prevState.data, ...results.map(r => r.data)]
       };
    })
  })
}

вместо этого попробуйте componentDidMount (componentWillMount устарело)

...