重新组合withHandlers ...异步?

时间:2017-01-17 17:36:23

标签: reactjs recompose

对于有承诺的守望者,是否可以/安全使用? 例:

withHandlers({
    onChange: props => event => {
      props.callAPI(props.data)
        .then(data => props.updateData(data))
    },
...

谢谢!

2 个答案:

答案 0 :(得分:3)

经过一些测试,我意识到它运作良好。 Recompose用于构建纯粹组件的岩石。

这非常有效并且运作良好。

const enhWithHandlers = withHandlers({
  loginUserMutation: props => args => {
    props.updateMutationState(loading: true, error: null });
    props.loginUser(args)
      .then(() =>
        props.updateMutationState({loading: false, error: null }))
      .catch(err =>
        props.updateMutationState({ loading: false, error: err }));
  }
},
...
// then compose like
export default compose(
  reduxConnect,
  gqlConnectLogin,
  gqlConnectRegister,
  enhWithState,
  enhWithHandlers
)(UserLoginRegister);

这有助于我克服缺乏用Apollo client将{(3}})的graphQl变异结果反映到包装组件的能力。这样可以完美地处理它,而不需要在组件本身中产生副作用。

答案 1 :(得分:0)

但是当我们这样使用它时会出现一些问题:

compose(
  withState('loginStatus', 'setLoginStatus', {loading: false, error:null}),
  withHandlers({
    loginUserMutation: props => async args => {
      try {
        props.setLoginStatus({loading: true, error: null});
        await props.loginUser(args);
      } catch(error) {
        props.setLoginStatus({...props.loginStatus, error});
      } finally {
        props.setLoginStatus({...props.loginStatus, loading: false});
      }
    }
  })
)

因为我们props之后确实丢失了await props.loginUser(args)引用。然后我们在错误之后使用它。

我们应该注意不要像上面那样使用它。