antd使用Form.useForm()获取数据域报错

ant design框架下在使用Form.useForm()获取数据域出现如下错误:
Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

  1. You might have mismatching versions of React and the renderer (such as React DOM)
  2. You might be breaking the Rules of Hooks
  3. You might have more than one copy of React in the same app
    在这里插入图片描述
    开始我认为是调用方式错误,以下是我的源代码:
    第一种:
    在这里插入图片描述
    第二种:
    在这里插入图片描述

然后我删除掉调用,仅剩下两种定义

// 第一种
const [ ywkcForm ] = Form.useForm();
// 第二种
this.state = {
...
ywkcForm: Form.useForm(),
...
}

但仍然出现相同的错误,最后重复查看adtd文档发现有如下提示:
在这里插入图片描述
我使用的是 class component,因此接下来使用ref获取数据域:
在这里插入图片描述
经过测试,成功通过ref获取表单数据,并进行重置等操作。
综上所述,在使用class component情况下,应该使用ref方法替代Form.useForm。

https://ant.design/components/form-cn/#API

  • 6
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值