使用Redux状态初始化React挂接窗体的默认值

vs91vp4v 于 2022-11-12 发布在 React

关注(0)|答案(1)|浏览(219)

我很难使用React Redux对象为React钩子表单分配默认值。
我正在使用react-hook-form、Redux工具包和materialui。看起来问题出在materialui的TextField上，但我仍然无法解决它。

初始化

const dispatch = useDispatch()
const category = useSelector(state => state.inventory.categories.category)

useEffect(() => {
  dispatch(getCategoryData(id))
}, [])

React挂钩表单的初始化

const { register, handleSubmit, reset } = useForm({
  defaultValues: {
    name: category.name
  }
})

JSX无法运作

< TextField
  name='name'
  id='name'
  label='name'
  variant='outlined'
  InputLabelProps={{
    shrink: true,
  }}
  className={classes.form__item}
  inputRef={register}
/>

redux

来源：https://stackoverflow.com/questions/63411021/initializing-default-values-of-a-react-hook-form-using-redux-state

1条答案

按热度按时间

tp5buhyn1#

这很可能是一个呈现问题，其中表单挂钩在redux完成其数据获取之前建立默认值。例如，如果您使用useForm中的reset添加了一个额外的useEffect子句，我怀疑表单将使用默认值填充。

const { register, handleSubmit, reset } = useForm({
  defaultValues: {
    name: category.name
  }
})

useEffect(() => {
  reset({ name: category.name })
},[category])

赞(0）回复(0）举报 2022-11-12

我来回答

使用Redux状态初始化React挂接窗体的默认值

1条答案

相关问题

热门标签

最新问答