Promesses JavaScript

L’auteur de ce sujet a trouvé une solution à son problème.
Auteur du sujet

Bonjour,

J’ai encore beaucoup de mal avec les promesses et surtout le Promise.all() en JavaScript. Pour mon problème, je reçois une liste de missions qui possèdent toutes un leaderId. J’aimerais récupérer l’utilisateur correspondant à ce leaderId. Voici mon code :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
// Je récupère les missions
retrieveMissions({commit, dispatch, state}, force = false) {
    return new Promise((resolve, reject) => {
        if (state.missions.length === 0 || force) {
            MissionsApi.getAll()
                .then(missions => dispatch('setLeaders', missions.data))
                .then(missions => {
                    commit('SET_ALL_MISSIONS', missions);
                    resolve();
                })
                .catch(err => reject(err));
        }
        else {
            resolve();
        }
    });
},

// Je définis les leaders pour chaque mission récupérée
setLeaders({dispatch}, missions) {
    let promises = [];

    missions.forEach(mission => {
        promises.push(
            dispatch('getUserById', mission.leaderId)
                .then(user => {
                    mission.leader = user;
                })
        );
    });

    return Promise.all(promises);
},

La fonction setLeaders ne fonctionne pas, elle ne retourne rien. J’utilise le protocole Flux avec VueX, d’où les fonctions un peu bizarre comme disptach et commit qui me servent à appeler d’autre fonction.

Merci de votre aide ! :)

Édité par Wizix

+0 -0
Auteur du sujet

Effectivement, ça fonctionne mieux, merci !

Mais du coup j’obtiens la liste des leader, je n’ai pas modifié mes missions avec l’utilisateur dans mission.leader.

+0 -0

Cette réponse a aidé l’auteur du sujet

Tu peux pas mal simplifier ton code, ici. :)

retrieveMissions ne nécessite pas de créer une nouvelle Promise, tu peux directement retourner celle que tu as déjà dedans et Promise.resolve().

Pas besoin de créer un array dans setLeaders, tu peux directement mapper missions.

+1 -0
Auteur du sujet

Effectivement, ça simplifie beaucoup !

Pas besoin de créer un array dans setLeaders, tu peux directement mapper missions.

Tu peux développer s’il te plait ? Merci ! :)

+0 -0
Auteur du sujet

J’ai compris la logique mais je n’arrive pas à l’appliquer à mon code. Voici ce que j’ai fait :

1
2
3
4
5
6
7
return Promise.all(missions.map(mission => {
    dispatch('getUserById', mission.leaderId)
        .then(user => {
           mission.leader = user;
           return mission;
        });
}));
+0 -0

Cette réponse a aidé l’auteur du sujet

Tu oublies de retourner.

Regarde la différence entre A, B et C :

1
2
3
4
const xs = [0, 1, 2, 3]
console.log('A', xs.map(x => { x * 2 }))
console.log('B', xs.map(x => x * 2))
console.log('C', xs.map(x => { return x * 2 }))
+0 -0
Vous devez être connecté pour pouvoir poster un message.
Connexion

Pas encore inscrit ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte