Ant Design form.setFieldsValue 和 initialValues prop 的区别

Question

如标题所述。两者有什么区别？

1.

import { Form } from 'antd';

const Components = () => {
  const [form] = Form.useForm();
  form.setFieldsValue({ ... });

  return (
    <Form form={form}>
      ...
    </Form>
  );
}

import { Form } from 'antd';

const Components = () => {
  return (
    <Form initialValues={{ ... }}>
      ...
    </Form>
  );
}

Answer 1

setFieldValues 适用于 on-demand 值设置。例如，如果您的表单上有一个“默认”按钮，可以将所有值设置回某个默认值。在表单上使用 setFieldValues 的问题是，如果您将 props 传递给那个更改或函数 prop，当 props 在应用程序中刷新时，setFieldValues 将被一遍又一遍地调用。这可能会导致表单在用户打开表单时随机重置为 setFieldValues 中的值。

initialValues 仅在表单初始化时设置初始值，不会出现上述相同问题，因此非常适合在具有 props 的情况下设置具有初始值的表单这可能会令人耳目一新或发生变化。这会导致您的表单表现良好，并且在表单被销毁之前不会对用户进行更改。

Ant Design form.setFieldsValue 和 initialValues prop 的区别

Difference between Ant Design form.setFieldsValue and initialValues prop

javascript

reactjs

antd