关于antd的from表单一些操作

最新推荐文章于 2024-07-24 11:13:53 发布

Gamelifezhao

最新推荐文章于 2024-07-24 11:13:53 发布

阅读量291

点赞数

文章标签：前端 reactjs

本文链接：https://blog.csdn.net/Gamelifezhao/article/details/126149532

版权

需求如下：

一个表单，表单外部有两个按钮根据外部按钮切换去清空from表单中指定inpur框的值

from表单中有内置的from.setFieldsValue方法

from.setFieldsValue({name:'xxx'})

通过这个来改变你from表单中某个item的的initialValue

from.item中要加上shouldUpdate否则不会重新渲染

from.setFieldsValue这个方法需要从Form.useform中解构出来

const {from} = From.useForm

同时你的from组件中也要加入from={from}

需求2:

对from表单中的各类输入框进行自定义输入校验

const  verify = (rule, value, callback) => {
            if(value。length =>2){
                callback('超出长度)
            }
}
<Form.Item
        label="Username"
        name="username"
        rules={[{ required:verify }]}
      >
        <Input />
      </Form.Item>

callback函数是错误提示。