Почему в моем состоянии остается пустой массив?

Question

Я устанавливаю состояние своего массива в componentDidMount, но не могу понять, почему он отображается как пустой при монтировании.

constructor(props){
    super(props);
    this.state = {
        currentGroup: this.props.currentGroup,
        eventHold: [],
        idHold: []
    }
}
componentDidMount(){
    const groupRef = firebase.database().ref('groups').child(this.state.currentGroup).child('events');
    var tempIdHold =[];
    groupRef.on('value', snapshot => {
        snapshot.forEach(function(snap)  {
            tempIdHold.push(snap.key)
        })

        this.setState({
            idHold: tempIdHold
        });
        console.log(tempIdHold)
        console.log(this.state.idHold)
    })
    this.loadGroupEvents(this.state.idHold);
}

Первый console.log показывает заполненный массив tempId, но второй console.log прямо под ним показывает пустой массив state.id. Зачем?

reactjs

0

Ben Cavenagh 23 Окт 2018 в 21:56

Answer 1

Потому что this.setState - это асинхронная функция. Итак, вы можете использовать обратный вызов в функции setState

this.setState({
 idHold: tempIdHold
}, () => {
 console.log(tempIdHold)
 console.log(this.state.idHold)
});

2

Ankush Sharma 23 Окт 2018 в 19:00

Answer 2

this.setState является асинхронным, который принимает обратный вызов, который будет вызываться после завершения операции, попробуйте добавить его и посмотрите результат

this.setState(
  { idHold: tempIdHold },
  // our updated state will be available in our callback
  () => console.log(this.state.idHold)
);

2

Asaf Aviv 23 Окт 2018 в 18:59

Почему в моем состоянии остается пустой массив?

2 ответа

Похожие вопросы

Новые вопросы

reactjs