在测试库中使用 setFieldsValue 后，我的 Antd 表单未设置值

Question

我正在使用带有 renderHook 的 testing-library/react-hooks 库，我的问题是我无法使用 setFieldsValue 为我的 antd 表单设置一个值，它没有设置值，缺少什么？

这是我的 Report.service.test.tsx:

it("user can export report with successfully", async () => {
    const formExportReportUserHook = renderHook(() => Form.useForm());
    const formReport = formExportReportUserHook.result.current[0];

    formReport.setFieldsValue({
      rangePicker: [dayjs(), dayjs()],
    });

    await onConfirmExportReport({
      formReport: formReport,
      message,
    });
  });
});

和我的Report.service.tsx

export const onConfirmExportReport = async ({
  formReport,
  message,
}: IExportReport) => {
  try {
    const { rangePicker }: IReport = await formReport.validateFields();
    const bodyRequest: IReportRequest = {
      initialEventTime: rangePicker[0].format("MM-DD-YYYY"),
      finalEventTime: rangePicker[1].format("MM-DD-YYYY"),
      ...

我的 const rangePicker 未定义，它找不到 rangePicker 值，在 Report.service.test 中设置但是如果我在服务中这样做

const getRangePicker= formReport.getFieldValue("rangePicker");

它将return值。我不知道我做错了什么。

Answer 1

我必须对 Report-service.tsx 进行一些更改，它起作用了

 export const onConfirmExportReport = async ({
      formReport,
      message,
    }: IExportReport) => {
      try {
        await formReport.validateFields();
        const rangePicker = formReport.getFieldValue("rangePicker");
        const bodyRequest: IReportRequest = {
          initialEventTime: rangePicker[0].format("MM-DD-YYYY"),
          finalEventTime: rangePicker[1].format("MM-DD-YYYY"),
    ...

在测试库中使用 setFieldsValue 后，我的 Antd 表单未设置值

My Antd form not set value after use setFieldsValue in Testing Library

javascript

reactjs

antd

react-testing-library

react-hooks