ZhengXingchi / ZhengXingchi.github.io

Apache License 2.0
0 stars 0 forks source link

dva #104

Open ZhengXingchi opened 4 years ago

ZhengXingchi commented 4 years ago

dva中effect内调用另一个effect的,实现put阻塞式调用的方法

参考dva中effect内调用另一个effect的,实现put阻塞式调用的方法

在项目中通常会有在一个effect中调用另一个effect的需求,实现方法就是直接使用put

*a({ payload}, {put, call,take}) {
      try {
          console.log(a)
          yield put({type: 'b',payload: {}});
          console.log(c)
          const info = yield call(serviceA, payload);
          put({
           type: 'save',
           payload: info,
          })
      }catch(e) {
      }
    },

 *b({ payload}, {put, call,take}) {
    yield call(serviceB, payload);
    console.log('b')
 }

但是put是一个非阻塞的方法,put的使用效果和在外部使用dispatch是一样的,所以上面的代码输出顺序是a,c,b,如果我们想等待b执行完再接下去执行a,就要用到take,take是redux-saga的方法当然再dva中也有,他是用来一次性监听dispatch过来的action的,而再effect 前后会额外触发 /@@start 和 /@@end 的 action,我们就可以监听/@@end,从而来监听effect的执行结束,代码如下

*a({ payload}, {put, call,take}) {
      try {
          console.log(a)
          yield put({type: 'b',payload: {}}); //触发b
          yield take('b/@@end') //直到监听到b结束才继续执行
          console.log(c)
          const info = yield call(serviceA, payload);
          put({
           type: 'save',
           payload: info,
          })
      }catch(e) {
      }
    },

 *b({ payload}, {put, call,take}) {
    yield call(serviceB, payload);
    console.log('b')
 }

这种阻塞的需求很常见,所以这种方法很有用.

但是这里有一个疑惑,call方法好像也能触发effect,在文档中有些,但是实际使用中call内部必须传入方法参数,不知道是什么问题,call本来就是阻塞方法,如果可以直接使用call是最好的,已经提了issuse希望可以解决