mirror/element-plus
2
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2024-11-27 02:01:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(components): [image-viewer] Add rotate event when rotating images (#14138)

Browse Source 
* feat(components): [image-viewer] Add rotate event when rotating images

* Update docs/en-US/component/image.md

Co-authored-by: btea <2356281422@qq.com>

---------

Co-authored-by: btea <2356281422@qq.com>
This commit is contained in:
Bean Deng 邓斌 2023-09-06 14:28:14 +08:00 committed by GitHub
parent 9a60a90e1e
commit 95494b7154
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 4 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
docs/en-US/component/image.md
View File

@ -116,6 +116,7 @@ image/image-preview
| ------ | ------------------------------------------------------------------------------------------------- | ------------------------------------ | | ------ | ------------------------------------------------------------------------------------------------- | ------------------------------------ |
| close | trigger when clicking on close button or when `hide-on-click-modal` enabled clicking on backdrop. | ^[Function]`() => void` | | close | trigger when clicking on close button or when `hide-on-click-modal` enabled clicking on backdrop. | ^[Function]`() => void` |
| switch | trigger when switching images. | ^[Function]`(index: number) => void` | | switch | trigger when switching images. | ^[Function]`(index: number) => void` |
| rotate ^(2.3.13) | trigger when rotating images. | ^[Function]`(deg: number) => void` |
### Image Viewer Exposes ### Image Viewer Exposes

1
packages/components/image-viewer/src/image-viewer.ts
View File

@ -70,6 +70,7 @@ export type ImageViewerProps = ExtractPropTypes<typeof imageViewerProps>
export const imageViewerEmits = { export const imageViewerEmits = {
close: () => true, close: () => true,
switch: (index: number) => isNumber(index), switch: (index: number) => isNumber(index),
rotate: (deg: number) => isNumber(deg),
} }
export type ImageViewerEmits = typeof imageViewerEmits export type ImageViewerEmits = typeof imageViewerEmits

2
packages/components/image-viewer/src/image-viewer.vue
View File

@ -345,9 +345,11 @@ function handleActions(action: ImageViewerAction, options = {}) {
break break
case 'clockwise': case 'clockwise':
transform.value.deg += rotateDeg transform.value.deg += rotateDeg
emit('rotate', transform.value.deg)
break break
case 'anticlockwise': case 'anticlockwise':
transform.value.deg -= rotateDeg transform.value.deg -= rotateDeg
emit('rotate', transform.value.deg)
break break
} }
transform.value.enableTransition = enableTransition transform.value.enableTransition = enableTransition