diff --git a/packages/core/client/src/schema-component/antd/date-picker/DatePicker.tsx b/packages/core/client/src/schema-component/antd/date-picker/DatePicker.tsx
index 984b0b0ef1..209f1fd42a 100644
--- a/packages/core/client/src/schema-component/antd/date-picker/DatePicker.tsx
+++ b/packages/core/client/src/schema-component/antd/date-picker/DatePicker.tsx
@@ -54,9 +54,9 @@ export const DatePicker: ComposedDatePicker = (props: any) => {
   const value = Array.isArray(props.value) ? props.value[0] : props.value;
   const newProps = {
     utc,
+    inputReadOnly: true,
     ...props,
     showTime: props.showTime ? { defaultValue: dayjs('00:00:00', 'HH:mm:ss') } : false,
-    inputReadOnly: true,
   };
   return <InternalDatePicker {...newProps} value={value} />;
 };
@@ -99,11 +99,11 @@ DatePicker.RangePicker = function RangePicker(props: any) {
   const newProps: any = {
     utc,
     presets,
+    inputReadOnly: true,
     ...props,
     format: getDateTimeFormat(targetPicker, targetDateFormat, showTime, timeFormat),
     picker: targetPicker,
     showTime: showTime ? { defaultValue: [dayjs('00:00:00', 'HH:mm:ss'), dayjs('23:59:59', 'HH:mm:ss')] } : false,
-    inputReadOnly: true,
   };
   const [stateProps, setStateProps] = useState(newProps);
   if (isFilterAction) {
@@ -171,12 +171,12 @@ DatePicker.FilterWithPicker = function FilterWithPicker(props: any) {
   const targetDateFormat = getPickerFormat(targetPicker) || format;
   const newProps = {
     utc,
+    inputReadOnly: true,
     ...props,
     underFilter: true,
     showTime: showTime ? { defaultValue: dayjs('00:00:00', 'HH:mm:ss') } : false,
     format: getDateTimeFormat(targetPicker, targetDateFormat, showTime, timeFormat),
     picker: targetPicker,
-    inputReadOnly: true,
     onChange: (val) => {
       props.onChange(undefined);
       setTimeout(() => {
diff --git a/packages/core/client/src/schema-component/antd/date-picker/demos/demo1.tsx b/packages/core/client/src/schema-component/antd/date-picker/demos/demo1.tsx
index db937d7c6e..94039f35b6 100644
--- a/packages/core/client/src/schema-component/antd/date-picker/demos/demo1.tsx
+++ b/packages/core/client/src/schema-component/antd/date-picker/demos/demo1.tsx
@@ -1,5 +1,3 @@
-
-
 /**
  * title: DatePicker
  */
@@ -18,6 +16,7 @@ const schema = {
       'x-component-props': {
         dateFormat: 'YYYY/MM/DD',
         showTime: true,
+        inputReadOnly: false,
       },
       'x-reactions': {
         target: '*(read1,read2)',
diff --git a/packages/core/client/src/schema-component/antd/date-picker/demos/demo2.tsx b/packages/core/client/src/schema-component/antd/date-picker/demos/demo2.tsx
index 2a3d446cde..201b35920d 100644
--- a/packages/core/client/src/schema-component/antd/date-picker/demos/demo2.tsx
+++ b/packages/core/client/src/schema-component/antd/date-picker/demos/demo2.tsx
@@ -1,5 +1,3 @@
-
-
 /**
  * title: DatePicker (GMT)
  */
@@ -19,6 +17,7 @@ const schema = {
         dateFormat: 'YYYY/MM/DD',
         showTime: true,
         gmt: true,
+        inputReadOnly: false,
       },
       default: '2022-06-04T15:00:00.000Z',
       'x-reactions': {
diff --git a/packages/core/client/src/schema-component/antd/date-picker/demos/demo3.tsx b/packages/core/client/src/schema-component/antd/date-picker/demos/demo3.tsx
index 63597b8c4a..b67913f78e 100644
--- a/packages/core/client/src/schema-component/antd/date-picker/demos/demo3.tsx
+++ b/packages/core/client/src/schema-component/antd/date-picker/demos/demo3.tsx
@@ -1,5 +1,3 @@
-
-
 /**
  * title: DatePicker
  */
@@ -19,6 +17,7 @@ const schema = {
         dateFormat: 'YYYY/MM/DD',
         showTime: false,
         utc: false,
+        inputReadOnly: false,
       },
       'x-reactions': {
         target: '*(read1,read2)',
diff --git a/packages/core/client/src/schema-component/antd/date-picker/demos/demo7.tsx b/packages/core/client/src/schema-component/antd/date-picker/demos/demo7.tsx
index e3de179d0b..d741014241 100644
--- a/packages/core/client/src/schema-component/antd/date-picker/demos/demo7.tsx
+++ b/packages/core/client/src/schema-component/antd/date-picker/demos/demo7.tsx
@@ -1,5 +1,3 @@
-
-
 /**
  * title: DatePicker
  */
@@ -20,6 +18,7 @@ const schema = {
         showTime: false,
         gmt: true,
         utc: true,
+        inputReadOnly: false,
       },
       'x-reactions': {
         target: '*(read1,read2)',
diff --git a/packages/core/client/src/schema-component/antd/date-picker/demos/demo8.tsx b/packages/core/client/src/schema-component/antd/date-picker/demos/demo8.tsx
index 81309fc9d7..572e5a1ee0 100644
--- a/packages/core/client/src/schema-component/antd/date-picker/demos/demo8.tsx
+++ b/packages/core/client/src/schema-component/antd/date-picker/demos/demo8.tsx
@@ -1,5 +1,3 @@
-
-
 /**
  * title: DatePicker
  */
@@ -20,6 +18,7 @@ const schema = {
         showTime: false,
         gmt: false,
         utc: true,
+        inputReadOnly: false,
       },
       'x-reactions': {
         target: '*(read1,read2)',