AvatarCropper 头像裁剪

<!-- 基础用法 -->
  <re-button theme="primary" @click="showCropper1 = true">打开头像裁剪</re-button>
  <re-avatar-cropper :visible="showCropper1" image="https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?w=400" @update:visible="showCropper1 = $event" />

<!-- 隐藏状态 -->
  <re-avatar-cropper :visible="false" image="https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?w=400" />

<!-- 无图片 -->
  <re-button theme="primary" @click="showCropper3 = true">打开（无图片）</re-button>
  <re-avatar-cropper :visible="showCropper3" image="" @update:visible="showCropper3 = $event" />

<!-- 自定义样式 -->
  <re-button theme="primary" @click="showCropper4 = true">打开自定义样式</re-button>
  <re-avatar-cropper :visible="showCropper4" image="https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?w=400" customStyle="background-color: rgba(0,0,0,0.9);" @update:visible="showCropper4 = $event" />

<!-- 裁剪控件 -->
  <re-button theme="primary" @click="showCropper5 = true">打开裁剪控件</re-button>
  <re-avatar-cropper :visible="showCropper5" image="https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?w=400" @update:visible="showCropper5 = $event" />

<!-- 裁剪框 -->
  <re-button theme="primary" @click="showCropper6 = true">打开裁剪框</re-button>
  <re-avatar-cropper :visible="showCropper6" image="https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?w=400" @update:visible="showCropper6 = $event" />

<!-- 底部按钮 -->
  <re-button theme="primary" @click="showCropper7 = true">打开底部按钮</re-button>
  <re-avatar-cropper :visible="showCropper7" image="https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?w=400" @update:visible="showCropper7 = $event" />

<!-- 完整功能 -->
  <re-button theme="primary" @click="showCropper8 = true">打开完整功能</re-button>
  <re-avatar-cropper :visible="showCropper8" image="https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?w=400" @update:visible="showCropper8 = $event" />