diff --git a/src/components/Cropper/src/CropperAvatar.vue b/src/components/Cropper/src/CropperAvatar.vue
index 6739be053..4617da7c9 100644
--- a/src/components/Cropper/src/CropperAvatar.vue
+++ b/src/components/Cropper/src/CropperAvatar.vue
@@ -29,7 +29,16 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent, computed, CSSProperties, unref, ref, watchEffect, watch } from 'vue';
+  import {
+    defineComponent,
+    computed,
+    CSSProperties,
+    unref,
+    ref,
+    watchEffect,
+    watch,
+    PropType,
+  } from 'vue';
   import CopperModal from './CopperModal.vue';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { useModal } from '/@/components/Modal';
@@ -42,7 +51,7 @@
     width: { type: [String, Number], default: '200px' },
     value: { type: String },
     showBtn: { type: Boolean, default: true },
-    btnProps: { type: Object as ButtonProps },
+    btnProps: { type: Object as PropType<ButtonProps> },
     btnText: { type: String, default: '' },
     uploadApi: { type: Function as PropType<({ file: Blob, name: string }) => Promise<void>> },
   };
@@ -52,10 +61,10 @@
     components: { CopperModal, Icon },
     props,
     emits: ['update:value', 'change'],
-    setup(props, { emit }) {
+    setup(props, { emit, expose }) {
       const sourceValue = ref(props.value || '');
       const { prefixCls } = useDesign('cropper-avatar');
-      const [register, { openModal }] = useModal();
+      const [register, { openModal, closeModal }] = useModal();
       const { createMessage } = useMessage();
       const { t } = useI18n();
 
@@ -72,7 +81,7 @@
       );
 
       watchEffect(() => {
-        sourceValue.value = props.value;
+        sourceValue.value = props.value || '';
       });
 
       watch(
@@ -88,6 +97,8 @@
         createMessage.success(t('component.cropper.uploadSuccess'));
       }
 
+      expose({ openModal: openModal.bind(null, true), closeModal });
+
       return {
         t,
         prefixCls,