mirror of
https://github.com/element-plus/element-plus.git
synced 2026-03-13 07:51:17 +08:00
docs(components): [image] add type of crossorigin (#15471)
* docs(components): [image] add type of crossorigin
* Revert "docs(components): [image] add type of crossorigin"
This reverts commit a87f7803cc.
* fix(components): [image] clear the default value of crossorigin.
* docs(components): [image] set crossorigin default type to ''.
* docs(components): [image] format table style
* fix(components): [image] remove the default value of crossorigin.
* Update docs/en-US/component/image.md
* fix(components): [image] remove type declarations for crossorigin constants
---------
Co-authored-by: kooriookami <38392315+kooriookami@users.noreply.github.com>
This commit is contained in:
@@ -59,26 +59,26 @@ 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). | ^[enum]`'' \| '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 |
|
||||
| loading ^(2.2.3) | Indicates how the browser should load the image, same as [native](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-loading). | ^[enum]`'eager' \| 'lazy'` | — |
|
||||
| lazy | whether to use lazy load. | ^[boolean] | false |
|
||||
| scroll-container | the container to add scroll listener when using lazy load. By default, the container to add scroll listener when using lazy load. | ^[string] / ^[object]`HTMLElement` | — |
|
||||
| alt | native attribute `alt`. | ^[string] | — |
|
||||
| referrerpolicy | native attribute [referrerPolicy](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/referrerPolicy). | ^[string] | — |
|
||||
| crossorigin | native attribute [crossorigin](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/crossorigin). | ^[enum]`'' \| 'anonymous' \| 'use-credentials'` | 'anonymous' | — |
|
||||
| preview-src-list | allow big image preview. | ^[object]`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 |
|
||||
| infinite | whether the viewer preview is infinite. | ^[boolean] | true |
|
||||
| zoom-rate | the zoom rate of the image viewer zoom event. | ^[number] | 1.2 |
|
||||
| min-scale ^(2.4.0) | the min scale of the image viewer zoom event. | ^[number] | 0.2 |
|
||||
| max-scale ^(2.4.0) | the max scale of the image viewer zoom event. | ^[number] | 7 |
|
||||
| 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). | ^[enum]`'' \| '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 |
|
||||
| loading ^(2.2.3) | Indicates how the browser should load the image, same as [native](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-loading). | ^[enum]`'eager' \| 'lazy'` | — |
|
||||
| lazy | whether to use lazy load. | ^[boolean] | false |
|
||||
| scroll-container | the container to add scroll listener when using lazy load. By default, the container to add scroll listener when using lazy load. | ^[string] / ^[object]`HTMLElement` | — |
|
||||
| alt | native attribute `alt`. | ^[string] | — |
|
||||
| referrerpolicy | native attribute [referrerPolicy](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/referrerPolicy). | ^[string] | — |
|
||||
| crossorigin | native attribute [crossorigin](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/crossorigin). | ^[enum]`'' \| 'anonymous' \| 'use-credentials'` | — |
|
||||
| preview-src-list | allow big image preview. | ^[object]`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 |
|
||||
| infinite | whether the viewer preview is infinite. | ^[boolean] | true |
|
||||
| zoom-rate | the zoom rate of the image viewer zoom event. | ^[number] | 1.2 |
|
||||
| min-scale ^(2.4.0) | the min scale of the image viewer zoom event. | ^[number] | 0.2 |
|
||||
| max-scale ^(2.4.0) | the max scale of the image viewer zoom event. | ^[number] | 7 |
|
||||
|
||||
### Image Events
|
||||
|
||||
|
||||
@@ -108,7 +108,6 @@ export const imageProps = buildProps({
|
||||
*/
|
||||
crossorigin: {
|
||||
type: definePropType<'anonymous' | 'use-credentials' | ''>(String),
|
||||
default: 'anonymous',
|
||||
},
|
||||
} as const)
|
||||
export type ImageProps = ExtractPropTypes<typeof imageProps>
|
||||
|
||||
@@ -85,7 +85,7 @@ const rawAttrs = useRawAttrs()
|
||||
const attrs = useAttrs()
|
||||
|
||||
const imageSrc = ref<string | undefined>()
|
||||
const crossorigin = ref<string>(props.crossorigin)
|
||||
const crossorigin = ref(props.crossorigin)
|
||||
const hasLoadError = ref(false)
|
||||
const isLoading = ref(true)
|
||||
const showViewer = ref(false)
|
||||
|
||||
Reference in New Issue
Block a user