一旦array.push完成就会反应原生

Question

有什么方法可以捕获array.push函数何时完成？我从Firebase数据库获取数据然后将数据推送到数组（这是状态）。不幸的是，我注意到每个项目都会改变我的状态。

检查screen以便更好地理解

我在数据库中有2个对象。

有代码：

componentWillMount(){
    const self = this;
    const rootRef = firebase.database().ref('/users/' + firebase.auth().currentUser.uid);
    const ref = rootRef.child("MyTeams");
    let teamsArr = [];
    ref.once("value").then(function(snapshot) {
        snapshot.forEach(function(childSnapshot) {
            self.setState({TeamName: childSnapshot.val()});
            teamsArr.push(self.state.TeamName);
            self.setState({TeamsToMap: teamsArr});
            self.setState({Loaded: true});
            console.log('Here: ' + self.state.TeamsToMap);
        })
    })
        .catch((error) =>{
            alert(error.message);
        })
};


WriteTeams(navigation){
    if(this.state.TeamsToMap.length > 0 && this.state.Loaded === true){
        console.log('Somewhere: ' + this.state.TeamsToMap.length);
    }
}

Answer 1

由于您在快照上循环，因此阵列会被多次修改。如果您只想在修改完成后打印它：在循环后移动console.log()语句。

ref.once("value").then(function(snapshot) {
    snapshot.forEach(function(childSnapshot) {
        self.setState({TeamName: childSnapshot.val()});
        teamsArr.push(self.state.TeamName);
        self.setState({TeamsToMap: teamsArr});
        self.setState({Loaded: true});
    })
    console.log('Here: ' + self.state.TeamsToMap);
})

由于此处snapshot.forEach()和teamsArr.push()都是同步的，console.log()将在teamsArr完全填充后运行。