diff --git a/docs/component/img-cropper.md b/docs/component/img-cropper.md
index 70b4b8e7..a977d5ac 100644
--- a/docs/component/img-cropper.md
+++ b/docs/component/img-cropper.md
@@ -4,9 +4,9 @@
 
 ## 基本用法
 
-图片裁剪组件需要绑定 `v-model` 来控制组件的显示与隐藏，通过属性 `img-src` 控制展示的图片资源位，也可以通过函数 `resetImg` 来控制组件图片的初始化。进入组件后，可以对图片进行拖拽、双指缩放、旋转等操作。监听 `confirm` 事件获取选中值。
+图片裁剪组件需要绑定 `v-model` 来控制组件的显示与隐藏，通过属性 `img-src` 控制展示的图片资源。进入组件后，可以对图片进行拖拽、双指缩放、旋转等操作，监听 `confirm` 事件获取裁剪结果。
 
-> *注意：在使用组件时，最好在一个新页面中使用图片裁剪组件，图片裁剪保持`show`为true，完成裁剪时，返回上一页。*
+> *注意：建议在新页面中使用图片裁剪组件，保持 `show` 为 true，完成裁剪后返回上一页。*
 
 ```html
 <wd-img-cropper
@@ -55,51 +55,13 @@ function handleCancel(event) {
 }
 ```
 
-## Attributes
+## 自定义裁剪比例
 
-| 参数 | 说明 | 类型 | 可选值 | 默认值| 最低版本 |
-|-----|------|-----|-------|-------|--------|
-| v-model | 打开图片裁剪组件 | boolean | - | false | - |
-| img-src | 图片资源链接 | string | - | - | - |
-| img-width | 截屏预览图片的初始宽度; `1、设置宽度不设置高度，按照宽度等比缩放；2、如果都不设置，预览时图片大小会根据裁剪框大小进行等比缩放，进行锁边处理；`; string 类型只支持 % 单位，number 类型时单位为 px | number / string | - | - | - |
-| img-height | 截屏预览图片的初始高度; `1、设置高度不设置宽度，按照高度等比缩放；2、如果都不设置，预览时图片大小会根据裁剪框大小进行等比缩放，进行锁边处理；`; string 类型只支持 % 单位，number 类型时单位为 px | number / string | - | - | - |
-| disabled-rotate | 禁止图片旋转 | boolean | - | false | - |
-| export-scale | 设置导出图片尺寸 | number | - | 2 | - |
-| max-scale | 最大缩放倍数 | number | - | 3 | - |
-| cancel-button-text | 取消按钮文案 | string | - | 取消 | - |
-| confirm-button-text | 确认按钮文案 | string | - | 完成 | - |
-| quality | 生成的图片质量 [wx.canvasToTempFilePath属性介绍](https://developers.weixin.qq.com/miniprogram/dev/api/canvas/wx.canvasToTempFilePath.html#%E5%8F%82%E6%95%B0) | number | 0/1 | 1 | - |
-| file-type | 目标文件的类型，[wx.canvasToTempFilePath属性介绍](https://developers.weixin.qq.com/miniprogram/dev/api/canvas/wx.canvasToTempFilePath.html#%E5%8F%82%E6%95%B0) | string | - | png | - |
-| aspect-ratio | 裁剪框宽高比，格式为 width:height | string | - | 1:1 | $LOWEST_VERSION$ |
+通过 `aspect-ratio` 属性可以设置裁剪框的宽高比，格式为 `width:height`。
 
-## Events
-
-| 事件名称 | 说明 | 参数 | 最低版本 |
-|---------|-----|-----|---------|
-| confirm | 完成截图时触发 |  `{tempFilePath, width, height}` 分别为生成文件的临时路径 (本地路径)、生成图片宽、生成图片高| - |
-| cancel | 当取消截图时触发 | - | - |
-| imgloaderror | 当图片加载错误时触发 |  `{err} `| - |
-| imgloaded | 当图片加载完成时触发 |  `{res}` | - |
-
-## Methods
-
-对外暴露函数
-
-| 事件名称 | 说明 | 参数 | 最低版本 |
-|--------|------|-----|---------|
-| setRoate | 设置图片旋转角度 | deg (设置的旋转角度)| - |
-| resetImg | 重置图片的角度、缩放、位置 | - | - |
-
-## 外部样式类
-
-| 类名 | 说明 | 最低版本 |
-|-----|------|--------|
-| custom-class | 根节点样式 | - |
-
-## 基本用法
+### 3:2 适合拍照
 
 ```html
-<!-- 设置3:2的裁剪框 -->
 <wd-img-cropper
   v-model="show"
   :img-src="src"
@@ -110,6 +72,34 @@ function handleCancel(event) {
 </wd-img-cropper>
 ```
 
+### 16:9 影视比例
+
+```html
+<wd-img-cropper
+  v-model="show"
+  :img-src="src"
+  aspect-ratio="16:9"
+  @confirm="handleConfirm"
+  @cancel="handleCancel"
+>
+</wd-img-cropper>
+```
+
+### 16:10 这么阔 很有型
+
+16:10 的显示比例非常适合展示风景照片或者电影海报等宽屏内容。
+
+```html
+<wd-img-cropper
+  v-model="show"
+  :img-src="src"
+  aspect-ratio="16:10"
+  @confirm="handleConfirm"
+  @cancel="handleCancel"
+>
+</wd-img-cropper>
+```
+
 ## 裁剪后上传
 
 结合 `useUpload` 可以实现裁剪完成后自动上传图片的功能。
@@ -171,3 +161,44 @@ async function handleConfirmUpload(event) {
   }
 }
 ```
+
+## Attributes
+
+| 参数 | 说明 | 类型 | 可选值 | 默认值| 最低版本 |
+|-----|------|-----|-------|-------|--------|
+| v-model | 打开图片裁剪组件 | boolean | - | false | - |
+| img-src | 图片资源链接 | string | - | - | - |
+| img-width | 截屏预览图片的初始宽度; `1、设置宽度不设置高度，按照宽度等比缩放；2、如果都不设置，预览时图片大小会根据裁剪框大小进行等比缩放，进行锁边处理；`; string 类型只支持 % 单位，number 类型时单位为 px | number / string | - | - | - |
+| img-height | 截屏预览图片的初始高度; `1、设置高度不设置宽度，按照高度等比缩放；2、如果都不设置，预览时图片大小会根据裁剪框大小进行等比缩放，进行锁边处理；`; string 类型只支持 % 单位，number 类型时单位为 px | number / string | - | - | - |
+| disabled-rotate | 禁止图片旋转 | boolean | - | false | - |
+| export-scale | 设置导出图片尺寸 | number | - | 2 | - |
+| max-scale | 最大缩放倍数 | number | - | 3 | - |
+| cancel-button-text | 取消按钮文案 | string | - | 取消 | - |
+| confirm-button-text | 确认按钮文案 | string | - | 完成 | - |
+| quality | 生成的图片质量 [wx.canvasToTempFilePath属性介绍](https://developers.weixin.qq.com/miniprogram/dev/api/canvas/wx.canvasToTempFilePath.html#%E5%8F%82%E6%95%B0) | number | 0/1 | 1 | - |
+| file-type | 目标文件的类型，[wx.canvasToTempFilePath属性介绍](https://developers.weixin.qq.com/miniprogram/dev/api/canvas/wx.canvasToTempFilePath.html#%E5%8F%82%E6%95%B0) | string | - | png | - |
+| aspect-ratio | 裁剪框宽高比，格式为 width:height | string | - | 1:1 | $LOWEST_VERSION$ |
+
+## Events
+
+| 事件名称 | 说明 | 参数 | 最低版本 |
+|---------|-----|-----|---------|
+| confirm | 完成截图时触发 |  `{tempFilePath, width, height}` 分别为生成文件的临时路径 (本地路径)、生成图片宽、生成图片高| - |
+| cancel | 当取消截图时触发 | - | - |
+| imgloaderror | 当图片加载错误时触发 |  `{err} `| - |
+| imgloaded | 当图片加载完成时触发 |  `{res}` | - |
+
+## Methods
+
+对外暴露函数
+
+| 事件名称 | 说明 | 参数 | 最低版本 |
+|--------|------|-----|---------|
+| setRoate | 设置图片旋转角度 | deg (设置的旋转角度)| - |
+| resetImg | 重置图片的角度、缩放、位置 | - | - |
+
+## 外部样式类
+
+| 类名 | 说明 | 最低版本 |
+|-----|------|--------|
+| custom-class | 根节点样式 | - |
\ No newline at end of file
diff --git a/src/pages/imgCropper/Index.vue b/src/pages/imgCropper/Index.vue
index 9dd25837..10935322 100644
--- a/src/pages/imgCropper/Index.vue
+++ b/src/pages/imgCropper/Index.vue
@@ -1,7 +1,7 @@
 <!--
  * @Author: weisheng
  * @Date: 2023-09-20 11:10:41
- * @LastEditTime: 2025-03-25 22:59:47
+ * @LastEditTime: 2025-03-26 09:55:00
  * @LastEditors: weisheng
  * @Description: 
  * @FilePath: /wot-design-uni/src/pages/imgCropper/Index.vue
@@ -32,7 +32,7 @@
 
     <demo-block title="自定义裁剪比例" style="text-align: center">
       <view class="profile-grid">
-        <view v-for="(ratio, index) in ['1:1', '3:2', '16:9']" :key="index" class="profile-item">
+        <view v-for="(ratio, index) in ['3:2', '16:9', '16:10']" :key="index" class="profile-item">
           <wd-img-cropper
             v-model="showCustom[index]"
             :img-src="srcCustom[index]"
@@ -45,7 +45,7 @@
           </view>
           <wd-img
             v-if="imgSrcCustom[index]"
-            :width="ratio === '1:1' ? '200px' : '300px'"
+            width="300px"
             :height="getHeight(ratio)"
             :src="imgSrcCustom[index]"
             mode="aspectFit"
@@ -262,13 +262,7 @@ function getHeight(ratio: string): string {
   position: relative;
 }
 
-.profile-item:first-child .img {
-  width: 200px;
-  height: 200px;
-  border-radius: 50%;
-}
-
-.profile-item:nth-child(2) .img {
+.profile-item:nth-child(1) .img {
   height: 200px;
 }
 </style>
diff --git a/src/uni_modules/wot-design-uni/components/wd-img-cropper/wd-img-cropper.vue b/src/uni_modules/wot-design-uni/components/wd-img-cropper/wd-img-cropper.vue
index 559543c8..31970938 100644
--- a/src/uni_modules/wot-design-uni/components/wd-img-cropper/wd-img-cropper.vue
+++ b/src/uni_modules/wot-design-uni/components/wd-img-cropper/wd-img-cropper.vue
@@ -48,8 +48,8 @@
     </view>
     <!-- 绘制的图片canvas -->
     <canvas
-      canvas-id="wd-img-cropper-canvas"
-      id="wd-img-cropper-canvas"
+      :canvas-id="canvasId"
+      :id="canvasId"
       class="wd-img-cropper__canvas"
       :disable-scroll="true"
       :style="`width: ${Number(canvasWidth) * canvasScale}px; height: ${Number(canvasHeight) * canvasScale}px;`"
@@ -80,10 +80,12 @@ export default {
 import wdIcon from '../wd-icon/wd-icon.vue'
 import wdButton from '../wd-button/wd-button.vue'
 import { computed, getCurrentInstance, ref, watch } from 'vue'
-import { addUnit, objToStyle } from '../common/util'
+import { addUnit, objToStyle, uuid } from '../common/util'
 import { useTranslate } from '../composables/useTranslate'
 import { imgCropperProps, type ImgCropperExpose } from './types'
 
+const canvasId = ref<string>(`cropper${uuid()}`) // canvas 组件的唯一标识符
+
 // 延时动画设置
 let CHANGE_TIME: any | null = null
 // 移动节流
@@ -373,7 +375,7 @@ function computeImgSize() {
  */
 function initCanvas() {
   if (!ctx.value) {
-    ctx.value = uni.createCanvasContext('wd-img-cropper-canvas', proxy)
+    ctx.value = uni.createCanvasContext(canvasId.value, proxy)
   }
 }
 
@@ -575,7 +577,7 @@ function canvasToImage() {
       destHeight: Math.round(cutHeight.value * exportScale),
       fileType,
       quality,
-      canvasId: 'wd-img-cropper-canvas',
+      canvasId: canvasId.value,
       success: (res: any) => {
         const result = { tempFilePath: res.tempFilePath, width: cutWidth.value * exportScale, height: cutHeight.value * exportScale }
         // #ifdef MP-DINGTALK