@Villas56

Как правильно передать метод из стора в formik, чтобы обрабатывать серверные ошибки?

Всем привет!
У меня есть post метод в сторе signUpUser.
import {
  configure,
  observable,
  action,
  runInAction,
  } from 'mobx';
import axios from 'axios';
import get from 'lodash/get';

configure({ enforceActions: 'observed' });

type codeType = number | null;

export class UserStore {
  @observable status: string = 'pending';
  @observable errorMessage: {} = {};
  @observable code: codeType = null;

  @action
  signUpUser = async (signValue: {}) => {
    this.status = 'progress';
    this.errorMessage = {};
    this.code = null;
    try {
      await axios.post('/signup', signValue);
      runInAction(() => {
        this.status = 'succes';
    });
    } catch (error) {
      runInAction(() => {
        this.status = 'pressF';
        this.errorMessage = get(error, 'response.data.message.errors', null);
        this.code = get(error, 'response.status', null);
    });
    }
    if (this.status ===  'pressF' || 'succes') {
      setTimeout(() => {
        runInAction(() => {
          this.status = 'pending';
      });
      }, 2500);
    }
  }
}

И есть форма написанная на formik, куда передается метод(экшен)
const SignUp = ({ userStore }: any) => {
  const [, setStatus] = useState(userStore.status);

  useEffect(() => {
    if (!userStore.status) {
      setStatus(userStore.status);
    }
  }, [userStore.status]);

  const onSubmit = async (values: {}, { resetForm, setSubmitting }: FormikValues) => {
    try {
      if (userStore.code === 404) {
        setSubmitting(false);
        console.log('kek');
      }
      await userStore.signUpUser(values);
      resetForm();
    } catch (error) {
      console.log(error, 'error');
    }
  };
  return (
    <Formik
      initialValues={defaultValues}
      validate={onValidate}
      onSubmit={onSubmit}
      validationSchema={SignUpSchema}
      enableReinitialize
    >
      {props => (
        <Entry>
        <SubmitWrap>
          <Submit
            status={userStore.status}
            disabled={props.isSubmitting}
            type='submit'
          />
        </SubmitWrap>
      </Entry>
      )}
    </Formik>
  );
};

В onSubmit я передаю метод из стора, но формик не видит, что в этом методе есть ошибки(404, 500, серверная валидация и тд и тп) и onSubmit всегда выводит try блок.
Как мне дать понять формику, что метод из стора не прошел и вывести ошибки? При этом, очень хотелось бы чтобы метод оставался в сторе, если такое возможно
  • Вопрос задан
  • 447 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы