# ClCropperPreview CropperPreview

> 图片裁剪预览组件，预览裁剪后的图片效果

- **标签名**: `<cl-cropper-preview>`
- **引入**: `import { ClCropperPreview } from '@cldemo/library'`

## Props

| 参数 | 类型 | 默认值 | 必填 | 说明 |
|------|------|--------|------|------|
| className | `String` | `` | 否 |  |
| previewImageUrl | `String` | `` | 否 |  |
| coverImageUrl | `String` | `` | 否 |  |
| width | `Number` | `400` | 否 |  |
| height | `Number` | `400` | 否 |  |
| widthPreview | `Number` | `` | 否 |  |
| heightPreview | `Number` | `` | 否 |  |
| previewShape | `String` | `'square'` | 否 |  |
| isCenterBox | `Boolean` | `true` | 否 |  |
| isShowUploadBtn | `Boolean` | `true` | 否 |  |
| getCropperImageUrl | `Function` | `` | 否 |  |
| saveImageBase64 | `Function` | `` | 否 |  |

## Events

| 事件名 | 说明 |
|--------|------|
| onInitCoverImage |  |

## 方法

| 方法 | 说明 |
|------|------|
| getValue() | 获取当前值 |
| getCropperUrl() |  |
| getCoverUrlOriginal() |  |

## 基础用法

```vue
<cl-cropper-preview></cl-cropper-preview>
```
