Dva: 尝试支持调度返回承诺(EFFECT_ACTION)

创建于 2016-10-19  ·  10评论  ·  资料来源: dvajs/dva

最有用的评论

@nickzheng 尝试使用这个方法:

在组件里面使用 promise 包装 dispatch,例如:

   new Promise((resolve, reject) => {
      dispatch({
         type: 'users/create',
         payload: {
             values,
             resolve,
             reject,
         },
      }); 
   })
   .then( res => {
      console.log(res);
   })
  .catch( err => {
      console.log(err);
  })

而在 dva 的 effect 里面可以这样写:

* create({ payload }, { put, call }) {
  const { value, resolve, reject } = payload;
  // 一些操作之后

  if (success) {
     resolve('done');
  } else {
     reject('error');
  }
}

@sorrycc 之前的想法是不需要在发起 dispatch 的地方包装一层 promise,而 dva 可以自带这个功能,默认的 effect 可以返回 resolve 和 reject。

所有10条评论

1.如果我要集成 异步关闭, https://ant.design/components/modal-cn/#components-modal-demo-async, onOk 必须接受一个promise 在then 里面 this.setState({
visible: false,
confirmLoading: false,
});

在dva里面dispatch 一个action 后 ,
dispatch({
type: 'users/create',
payload: values,
}); 的值不是一个promise, 而是一个action 。

  1. 而解决方法可以是把visible,confirmLoading状态放到store里面。

    1. 有没有可能dva里面dispatch 一个action 后 , 是一个promise, redux-thunk 里面是一个promise, 我菜可能是saga 的实现不同吧

@nickzheng 尝试使用这个方法:

在组件里面使用 promise 包装 dispatch,例如:

   new Promise((resolve, reject) => {
      dispatch({
         type: 'users/create',
         payload: {
             values,
             resolve,
             reject,
         },
      }); 
   })
   .then( res => {
      console.log(res);
   })
  .catch( err => {
      console.log(err);
  })

而在 dva 的 effect 里面可以这样写:

* create({ payload }, { put, call }) {
  const { value, resolve, reject } = payload;
  // 一些操作之后

  if (success) {
     resolve('done');
  } else {
     reject('error');
  }
}

@sorrycc 之前的想法是不需要在发起 dispatch 的地方包装一层 promise,而 dva 可以自带这个功能,默认的 effect 可以返回 resolve 和 reject。

https://github.com/dvajs/dva-core/blob/0fa6888/test/effects-test.js#L332-L365 ,内置支持 dispatch(EffectAction) 返回 Promise 。

@sorrycc 赞一个,问下这个功能是哪个版本加上去的?好像没看到changelog?

@daskyrk 等 #772

它在dva@2 中受支持。

请问内置支持promise后, 在effect中如何定义resolve和reject?
怎么算成功, 怎么算失败呢?
@pizn 提供的方案中, 是通过payload把resolve和reject传进effct的, 然后在effect中调用action.payload,resolve

   new Promise((resolve, reject) => {
      dispatch({
         type: 'users/create',
         payload: {
             values,
             resolve,
             reject,
         },
      }); 
   })
   .then( res => {
      console.log(res);
   })
  .catch( err => {
      console.log(err);
  })

内置promise的意思是把上面变成下面么?

dispatch({
  type: 'users/create',
  payload: {
    values,
    resolve,
    reject,
  },
})
  .then(res => {
    console.log(res);
  })
  .catch(err => {
    console.log(err);
  })

项目

const { dispatch } = this.props;
dispatch({
   type: 'specification/fetch',
    payload: applicationId,
 }).then((data) => {
     console.log(data)
 });

模型

 effects: {
    * fetch({ payload }, { call, put, select}) {
      const response = yield call(querySpecification, payload);
      yield put({
        type: 'list',
        payload: response
      });
      return yield select(state => state.specification.list);  //important
    }
},
reducers: {
    list(state, action) {
      return {
        ...state,
        list: action.payload
      };
    }
  }

@Youthink 像下面我这种情况怎么办

project

this.props.dispatch({
    type: 'app/login',
    payload: {
        phone: '13312332131',
        smscode: '6666',
    }
}).then(data => {
    console.log('success result', data)
}).catch(err => {
    console.warn('error result', err)
})

model

*login({ payload }, { call, put }) {
    // 请求状态 fetching 为 true,方便页面显示loading状态
    yield put({ type: 'updateState', fetching: true })
    // 这里进行登录 service
    const login = yield call(authService.login, payload)
    // 如果上面的 authService.login 异常了,下面的逻辑就不会进行了,下面的 fetching 设置为 false 也不会执行到
    if (login) {
        yield put(NavigationActions.back())
        Storage.set('login', login)
    }
    // 这里重置下 状态 fetching 为 false
    yield put({type:'updateState', fetching: false })
},

我想不管是后端返回成功还是有异常,都能执行到 yield put({type:'updateState', fetching: false }) 。我知道可以在project里,不管是成功还是失败再发一个 dispatch 到 model 里设置fetching,但是感觉这么做似乎不是很妥。

此页面是否有帮助?
0 / 5 - 0 等级

相关问题

not3 picture not3  ·  3评论

pengfeiWang picture pengfeiWang  ·  3评论

BenAnn picture BenAnn  ·  3评论

zouyan532 picture zouyan532  ·  3评论

sorrycc picture sorrycc  ·  3评论