diff --git a/src/date-picker.js b/src/date-picker.js
index cef7d2d..c16bd51 100644
--- a/src/date-picker.js
+++ b/src/date-picker.js
@@ -482,9 +482,11 @@ export default {
         ...pick(this.$props, Object.keys(Component.props)),
         value: this.currentValue,
       };
-      const content = (
-        <Component {...{ props, on: { select: this.handleSelectDate }, ref: 'picker' }} />
-      );
+      const on = {
+        ...pick(this.$listeners, Component.emits || []),
+        select: this.handleSelectDate,
+      };
+      const content = <Component {...{ props, on, ref: 'picker' }} />;
       return (
         <div class={`${this.prefixClass}-datepicker-body`}>
           {this.renderSlot('content', content, {
diff --git a/src/datetime/datetime-panel.js b/src/datetime/datetime-panel.js
index ee77585..5d2ebc1 100644
--- a/src/datetime/datetime-panel.js
+++ b/src/datetime/datetime-panel.js
@@ -10,6 +10,7 @@ export default {
       default: 'mx',
     },
   },
+  emits: ['select', 'update:show-time-panel'],
   props: {
     ...CalendarPanel.props,
     ...TimePanel.props,
@@ -33,6 +34,9 @@ export default {
     value(val) {
       this.currentValue = val;
     },
+    defaultTimeVisible(val) {
+      this.$emit('update:show-time-panel', val);
+    },
   },
   methods: {
     closeTimePanel() {
diff --git a/src/datetime/datetime-range.js b/src/datetime/datetime-range.js
index 7c97798..840d652 100644
--- a/src/datetime/datetime-range.js
+++ b/src/datetime/datetime-range.js
@@ -10,6 +10,7 @@ export default {
       default: 'mx',
     },
   },
+  emits: ['select', 'update:show-time-panel'],
   props: {
     ...CalendarRange.props,
     ...TimeRange.props,
@@ -33,6 +34,9 @@ export default {
     value(val) {
       this.currentValue = val;
     },
+    defaultTimeVisible(val) {
+      this.$emit('update:show-time-panel', val);
+    },
   },
   methods: {
     closeTimePanel() {