仅具有2个或更多项目时才进行平面列表渲染

Question

我试图以平面列表的形式显示数据库中的某些用户，因此我将数据记录在this.state中的Array中，当我记录该变量始终包含数据时，问题是当该变量只有1个项目，它不会渲染，但是当我有2个以上项目时，它可以正确渲染。

constructor(props) {
    super(props)
    this.state = {
      isLoading: true,
      userData: null,
      Match: []
   }
  }

   componentDidMount() {
    user = firebase.auth().currentUser;
      firebase.database().ref('/users/' + user.uid).once('value').then(snapshot => {

      pro = snapshot.val()

      this.setState({userData: pro});
});

      var query = firebase.database().ref("users/" + user.uid + "/match").orderByKey();
      query.once("value")
      .then((snapshot)  => {
      snapshot.forEach((childSnapshot)  => {
      // key will be "ada" the first time and "alan" the second time
      var key = childSnapshot.key;
      console.log(key)
      // childData will be the actual contents of the child
      firebase.database().ref('/users/' + key).once('value').then(snapshot => {

        pro = snapshot.val()
        console.log(pro)
        photo = pro.photo[0] 
        this.state.Match.push({id: key, name: pro.name, uri: {uri: photo} })

        });
      })
    }).then(
        this.setState({isLoading: false})
    );;

  }



render() {
  if (this.state.isLoading == false ) {
    return (
      <View style={styles.main_container}>
      <View style={styles.statusBar}>
        <StatusBar
        hidden = {false}
        backgroundColor="#F1D145"
        ></StatusBar>
        </View>
        <FlatList
        data={this.state.Match}
        keyExtractor={(item) => item.id.toString()}
        renderItem={({item}) => 

        <TouchableOpacity 
        onPress={null}
        style={styles.Item}>
        <Image
          source={item.uri}
          style={{width: 100, height: 100, borderRadius: 20}} />
        <Text
        style={{ color: 'black', textAlign: 'center', fontSize: 24 }}>
          {item.name}
        </Text>
        </TouchableOpacity>
      }
        />
      </View>
    )
} else {
  return (
    <View style={styles.loading_container}>
      <ActivityIndicator size='large' />
    </View>
  )
}


}
}

我认为问题出在加载时，但它不会导致它仅在evrything完成后才加载活动：

.then(
        this.setState({isLoading: false})
    );;