diff --git a/playground/src/views/Upload.vue b/playground/src/views/Upload.vue
index 226e17b..605ccf2 100644
--- a/playground/src/views/Upload.vue
+++ b/playground/src/views/Upload.vue
@@ -1,8 +1,54 @@
 <script setup lang="ts">
+import { LButton, LUpload } from 'lucky-design'
+
+const onSuccess = (res: any) => {
+  // console.log(res)
+}
+const onProgress = (ev: ProgressEvent<XMLHttpRequestEventTarget>) => {
+  // console.log(ev)
+}
+
+const beforeUpload = (file: File) => {
+  // console.log(file)
+  return Promise.resolve()
+}
 </script>
 
 <template>
   <div>
-    <div>upload</div>
+    <div>
+      <p>
+        <LUpload
+          action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+          name="file"
+          :on-success="onSuccess"
+          :on-progress="onProgress"
+        >
+          <LButton text="上传" type="primary" />
+        </LUpload>
+      </p>
+      <p>
+        <LUpload
+          action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+          name="file"
+          :multiple="true"
+          :on-success="onSuccess"
+          :on-progress="onProgress"
+        >
+          <LButton text="上传" type="primary" />
+        </LUpload>
+      </p>
+      <p>
+        <LUpload
+          action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+          name="file"
+          :before-upload="beforeUpload"
+          :on-success="onSuccess"
+          :on-progress="onProgress"
+        >
+          <LButton text="上传" type="primary" />
+        </LUpload>
+      </p>
+    </div>
   </div>
 </template>
diff --git a/playground/src/vite-env.d.ts b/playground/src/vite-env.d.ts
index f59bb6d..a61f75f 100644
--- a/playground/src/vite-env.d.ts
+++ b/playground/src/vite-env.d.ts
@@ -6,6 +6,7 @@ declare module 'lucky-design' {
     LMessage,
     LTree,
     LBacktop,
+    LUpload,
   } from 'lucky-design'
-  export { LButton, LCheckbox, LDrawer, LMessage, LTree, LBacktop }
+  export { LButton, LCheckbox, LDrawer, LMessage, LTree, LBacktop, LUpload }
 }