Maison >interface Web >js tutoriel >Pourquoi ma référence Firebase n'est-elle pas définie en dehors de la fonction « once() » ?

Pourquoi ma référence Firebase n'est-elle pas définie en dehors de la fonction « once() » ?

Mary-Kate Olsen
Mary-Kate Olsenoriginal
2024-11-07 12:54:021078parcourir

Why is My Firebase Reference Undefined Outside the `once()` Function?

Pourquoi la référence Firebase est perdue en dehors de la fonction once()

Lors de la récupération de données de Firebase à l'aide de la fonction once() avec AngularJS, il est possible de rencontrer un problème où les références deviennent indéfinies lorsqu'elles sont utilisées en dehors de la portée de la fonction. Cela est dû à la nature asynchrone de la récupération des données Firebase.

Dans l'extrait de code fourni, l'instruction console.log(userList) après avoir attaché l'écouteur Firebase renvoie undefined. En effet, le processus de récupération des données n'est pas terminé lorsque la variable userList est attribuée.

Solution :

Il existe plusieurs approches pour résoudre ce problème :

Utilisez la liste des utilisateurs dans le rappel :

Accédez de manière asynchrone à la liste des utilisateurs dans le rappel de la fonction once(). Cela garantit que la récupération des données est terminée avant de continuer.

ref.once('value', function(snapshot) {
    users = snapshot.val();
    // ... Process and log user data within the callback ...
});

Renvoyer une promesse :

Renvoyer une promesse de la fonction getUsers() qui se résout avec l'utilisateur données une fois la récupération terminée. Cela permet d'obtenir un code plus propre et chaîné.

this.getUsers = function() {
    var ref = firebase.database().ref('/users/');
    return ref.once('value').then(function(snapshot) {
        // ... Process and return user data ...
    }).catch(function(error){
        alert('error:  ' + error);
    });
}

Utiliser Async/Await (ES2017) :

Avec ES2017, vous pouvez utiliser la syntaxe async/await pour créer le code asynchrone est plus synchrone. La fonction getUsers() doit être marquée comme async :

this.getUsers = async function() {
    var ref = firebase.database().ref('/users/');
    return ref.once('value').then(function(snapshot) {
        // ... Process and return user data ...
    }).catch(function(error){
        alert('error:  ' + error);
    });
}

Ensuite, appelez la fonction getUsers() en utilisant async/await :

async function getAndLogUsers() {
    const userList = await userService.getUsers();
    console.log(userList);
}

Comprendre la nature asynchrone de la récupération de données Firebase est crucial pour prévenir de tels problèmes. Les approches décrites ci-dessus fournissent des solutions efficaces pour accéder de manière fiable aux données Firebase, garantissant ainsi que les références sont correctement conservées.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn