老师你好,想问下loginAndFetch为什么要两个return

来源:8-3 登录第二部分 axios 设置通用 header

qq_我在时光机里找回忆

2020-12-17

// 登录与获取当前用户信息一起来
        loginAndFetch({ dispatch }, loginData) {
            // 返回这个结果之前,先触发login的action,然后等login有了结果后
            // 再触发fetchCurrentUser的action去获取用户信息,记得要返回用户信息,因为我们要拿到页面上去用的
            return dispatch('login', loginData).then(() => {
               return dispatch('fetchCurrentUser')
            })
        }

这节课讲到了组合action,也就是新写了一个叫loginAndFetch的action,在这里先用dispatch调用了第一个action,也就是login,发起了登录请求,dispatch返回的是promise。所以我们可以在调用完dispatch后,使用then回调,让登录请求触发完毕后再dispatch第二个action,用来获取用户信息。
这个流程我还是比较清楚的,就是看着这里的两层函数,有两个return,看着有点晕。我想请问一下老师,这两个return分别是什么含义,为什么需要这样的两个return呢?是不是我前面理解的流程还不够透彻啊

写回答

1回答

张轩

2020-12-18

同学你好 我觉得关键点是 你只要把 dispatch 返回的理解成 Promise 就好了 你可以想象一个普通的 Promise chain 就可以了。

第一个 return 将整个 Promise 返回,在外部就可以使用 loginAndFetch().then() 的调用方式了

第二个 return 将 内部的 Promise 返回,这样在 then 就可以拿到这个 Promise 返回的值了。

0
3
希望林柚一健康快乐成长
我好像又明白了,因为内层return并没有返回参数值,它最终只会返回一个成功的promise状态,而login方法的then方法返回的就是dispatch('fetchCurrentUser')的状态,所以loginAndFetch()。then()方法中的参数自然就是undefined
2022-04-01
共3条回复

Vue3 + TS 仿知乎专栏企业级项目

带你完成前后端分离复杂项目,率先掌握 vue3 造轮子技能

3211 学习 · 2364 问题

查看课程