Реагирует на форму перехвата с запросом на редукс и асин c

Question

Я использую React Hook Form с избыточным кодом.

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

Так что в компоненте у меня нет значения формы в начале. Только когда данные были назначены в Redux.

Как теперь я могу заполнить поля значениями из Redux?

export default function Foo() {
  const { baz } = useSelector(state => state.bar)

  useEffect(() => {
    dispatch(fetchBaz())
  }

  const { handleSubmit, register, errors, reset, watch, setError } = useForm({
         validationSchema,
         defaultValues: baz
  })

  return (
    <input
      key="someKey"
      name={bazBaz}
      ref={register}
      onChange={handleChange}
    />
  )
}

Проблема в том, что при рендеринге в первый раз baz еще не доступен, а defaultValues ​​только устанавливает {}.

Я нашел этот Asyn c запрос с формой ловушки , но baz еще не установлен в обещании, и поэтому я не может сделать reset(baz) там.

Как мне установить поля в форме с существующими значениями?