fix(form): fix datepicker format (#7622)

* fix: Datepicker does not support arrays in read-only mode * fix: Datepicker does not support arrays in read-only mode --------- Co-authored-by: linsm <[email protected]>
ant-design · Sep 5, 2023 · a6aa0db · a6aa0db
1 parent aa04250
commit a6aa0db
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 1 deletion.
diff --git a/packages/field/src/components/DatePicker/index.tsx b/packages/field/src/components/DatePicker/index.tsx
@@ -18,7 +18,9 @@ const formatDate = (text: any, format: any) => {
   if (typeof format === 'function') {
     return format(dayjs(text));
   } else {
-    return dayjs(text).format(format || 'YYYY-MM-DD');
+    return dayjs(text).format(
+      (Array.isArray(format) ? format[0] : format) || 'YYYY-MM-DD',
+    );
   }
 };
 

diff --git a/tests/field/datePick.test.tsx b/tests/field/datePick.test.tsx
@@ -164,4 +164,22 @@ describe('Field', () => {
       '<div><div><div>2016-11-22 15:22:44</div><div>2016-11-23 15:22:44</div></div></div>',
     );
   });
+
+  it(`📅  DatePicker support format is Array`, async () => {
+    const fn = jest.fn();
+    const html = render(
+      <Field
+        mode="read"
+        fieldProps={{
+          format: ['YYYY-MM-DD', 'YYYYMMDD'],
+        }}
+        onChange={fn}
+        text={dayjs()}
+        light
+        valueType="date"
+      />,
+    );
+
+    expect(html.baseElement.innerHTML).toBe('<div><div>2016-11-22</div></div>');
+  });
 });