Вопрос: перекомпонуйте с помощью Handlers ... асинхронно?


Можно ли / безопасно использовать withHandlers с обещаниями? Напр .:

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

Благодаря!


5


источник


Ответы:


После некоторых тестов я понял, что он работает очень хорошо. пересоставить  камни для строительства с чистыми компонентами.

Это совершенно верно и работает очень хорошо.

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);

Это помогает мне преодолеть недостаток способности отражать результаты мутации graphQl с Клиент Apollo  к обернутому компоненту. Это прекрасно справляется и без необходимости побочных эффектов в самом компоненте.


3



Но есть некоторые проблемы, когда мы используем его следующим образом:

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), Затем мы используем его после того, как это неправильно.

Мы должны заметить, что нельзя использовать его, как указано выше.



0



перекомпонуйте с помощью Handlers ... асинхронно? | Programmerz.ru