React Recompose: метод, созданный в WithStateProps, недоступен

Question

Я использую Рекомендовать, чтобы определить некоторые методы, как показано ниже:

export interface WithStateProps {
  isDisabled: boolean;
  isReady: boolean;
  setDisabled(value: boolean): void;
  setReady(value: boolean): void;
}


export const withStateHoc = withState('isDisabled', 'setDisabled', false);
export const withIsEligibleStateHoc = withState(
  'isReady',
  'setReady',
  true
);

export const isReady = (value : string) => {
  return value ? true : false
};

export type WrappedProps = StepContentProps &
  FormikProps<MyAddress> &
  InjectedIntlProps & 
  AddressFormHandlers & WithStateProps;

Когда я хочу использовать метод setReady, я получаю это сообщение: props.setReady is not a function Вот мой код:

export const withFormikHoc = withFormik<
  WrappedProps & RouteComponentProps<{}> & InjectedIntlProps & WithStateProps,
  MyAddress
>({
 handleSubmit: async (values, { props, setSubmitting }) => {
     const addressAlreadyVerified = isReady(values.country);
     if(addressAlreadyVerified) {
        props.setReady(true)
     }
   }
})

Когда я нахожу на props.setReady(true) в VCode, я вижу: (method) WithStateProps.setReady(value: boolean): void

Но я знаю, что props.setReady - это не функция!

У кого-нибудь естьИдея, что мне здесь не хватает?

Answer 1

Ну, я нахожу проблему, которая была моей ошибкой, в моем compose, который я добавил withFormikHoc до withStateHoc & withIsEligibleStateHoc, и это было причиной ошибки.После приведения их первая проблема решена.

Answer 2

Вы неправильно получаете реквизит.Ваш деконструктор неверен.

Вот как это должно выглядеть:

handleSubmit: async (values, { setSubmitting, ...props }) => {

Что это значит: из вашего компонента подпишите, извлеките setSubmitting в его собственную переменную и поместите все остальное внутриprops object.

Что вы должны сделать на самом деле:

handleSubmit: async (values, { setReady, setSubmitting }) => {
  const addressAlreadyVerified = isReady(values.country);
  if (addressAlreadyVerified) {
    setReady(true)
  }
}

Таким образом, вы извлекаете только те значения, которые вам нужны, из ваших реквизитов, и не получаете объектполный свойств, в которых вы на самом деле не нуждаетесь.

РЕДАКТИРОВАТЬ

Если вы хотите, вы можете выбрать НЕ разбирать что-либо, и ваша мощь может закончиться примерно так:

handleSubmit: async (values, props) => {
  const addressAlreadyVerified = isReady(values.country);
  if (addressAlreadyVerified) {
    props.setReady(true)
  }
}

Я только что понял, что вы вообще не используете setSubmitting.Вы можете просто удалить это, если хотите.