feat(components)[image] imageviewer add close-on-press-escape(#7154) (#7182)

* feat: imageviewer add close-on-press-escape(#7154)

Co-authored-by: xiaochenchen <xiaochen.chen@igg.com>
This commit is contained in:
Xc
2022-04-25 13:34:40 +08:00
committed by GitHub
parent 71d61bad5b
commit 335569e8a7
5 changed files with 24 additions and 14 deletions

View File

@@ -51,19 +51,20 @@ image/image-preview
### Image Attributes
| Name | Description | Type | Default |
| --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------- | ----------------------------------------------------------------------- |
| `src` | image source, same as native. | `string` | — |
| `fit` | indicate how the image should be resized to fit its container, same as [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit). | `'fill' \| 'contain' \| 'cover' \| 'none' \| 'scale'-down'` | — |
| `hide-on-click-modal` | when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode. | `boolean` | `false` |
| `lazy` | whether to use lazy load. | `boolean` | `false` |
| `scroll-container` | the container to add scroll listener when using lazy load. | `string \| HTMLElement` | the nearest parent container whose overflow property is auto or scroll. |
| `alt` | native attribute `alt`. | `string` | — |
| `referrer-policy` | native attribute `referrerPolicy`. | `string` | — |
| `preview-src-list` | allow big image preview. | `string[]` | — |
| `z-index` | set image preview z-index. | `number` | — |
| `initial-index` | initial preview image index, less than the length of `url-list`. | `number` | `0` |
| `preview-teleported` | whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`. | `boolean` | `false` |
| Name | Description | Type | Default |
| ----------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------- | ----------------------------------------------------------------------- |
| `src` | image source, same as native. | `string` | — |
| `fit` | indicate how the image should be resized to fit its container, same as [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit). | `'fill' \| 'contain' \| 'cover' \| 'none' \| 'scale'-down'` | — |
| `hide-on-click-modal` | when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode. | `boolean` | `false` |
| `lazy` | whether to use lazy load. | `boolean` | `false` |
| `scroll-container` | the container to add scroll listener when using lazy load. | `string \| HTMLElement` | the nearest parent container whose overflow property is auto or scroll. |
| `alt` | native attribute `alt`. | `string` | — |
| `referrer-policy` | native attribute `referrerPolicy`. | `string` | — |
| `preview-src-list` | allow big image preview. | `string[]` | — |
| `z-index` | set image preview z-index. | `number` | — |
| `initial-index` | initial preview image index, less than the length of `url-list`. | `number` | `0` |
| `close-on-press-escape` | whether the image-viewer can be closed by pressing ESC | `boolean` | `true` |
| `preview-teleported` | whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`. | `boolean` | `false` |
### Image Events