antd form表单输入框输入信息再删除然后点击搜素 搜索字段如何去除

在Ant Design中，Form组件的输入框可以通过设置allowClear属性来实现输入内容后点击清除按钮删除输入的信息。而要在点击搜索按钮时，去除搜索字段，可以通过以下几种方式实现：

1. 使用form.resetFields()方法重置表单字段，将所有字段重置为空。在点击搜索按钮时，可以在按钮的onClick事件处理函数中调用该方法。

import { Form, Button } from 'antd';

const MyForm = ({ form }) => {
  const handleSearch = () => {
    // 进行搜索操作
    // ...

    // 清空搜索字段
    form.resetFields();
  };

  return (
    <Form form={form}>
      <Form.Item name="searchField" label="搜索字段">
        <Input allowClear />
      </Form.Item>
      <Form.Item>
        <Button type="primary" onClick={handleSearch}>搜索</Button>
      </Form.Item>
    </Form>
  );
};

2. 使用form.setFieldsValue({ searchField: undefined })方法将搜索字段设置为undefined，即去除搜索字段的值。在点击搜索按钮时，可以在按钮的onClick事件处理函数中调用该方法。

import { Form, Button } from 'antd';

const MyForm = ({ form }) => {
  const handleSearch = () => {
    // 进行搜索操作
    // ...

    // 清空搜索字段
    form.setFieldsValue({ searchField: undefined });
  };

  return (
    <Form form={form}>
      <Form.Item name="searchField" label="搜索字段">
        <Input allowClear />
      </Form.Item>
      <Form.Item>
        <Button type="primary" onClick={handleSearch}>搜索</Button>
      </Form.Item>
    </Form>
  );
};

以上两种方法都可以实现在点击搜索按钮时去除搜索字段的值。具体使用哪种方法取决于你的需求和实际情况