From 52d89cc06dd021630cef57c0fced5bce1f6b0266 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=BA=91=E6=B7=91?= Date: Fri, 12 Jan 2024 16:06:33 +0800 Subject: [PATCH] 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 a87f7803cceea80d4c46526190be7cec9a9e45cd. * 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> --- docs/en-US/component/image.md | 40 ++++++++++++------------- packages/components/image/src/image.ts | 1 - packages/components/image/src/image.vue | 2 +- 3 files changed, 21 insertions(+), 22 deletions(-) diff --git a/docs/en-US/component/image.md b/docs/en-US/component/image.md index 5e07bf0684..e54fbdf4c5 100644 --- a/docs/en-US/component/image.md +++ b/docs/en-US/component/image.md @@ -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 diff --git a/packages/components/image/src/image.ts b/packages/components/image/src/image.ts index 4cc7823b03..6431074363 100644 --- a/packages/components/image/src/image.ts +++ b/packages/components/image/src/image.ts @@ -108,7 +108,6 @@ export const imageProps = buildProps({ */ crossorigin: { type: definePropType<'anonymous' | 'use-credentials' | ''>(String), - default: 'anonymous', }, } as const) export type ImageProps = ExtractPropTypes diff --git a/packages/components/image/src/image.vue b/packages/components/image/src/image.vue index 3054bdfa0f..682f39c7dc 100644 --- a/packages/components/image/src/image.vue +++ b/packages/components/image/src/image.vue @@ -85,7 +85,7 @@ const rawAttrs = useRawAttrs() const attrs = useAttrs() const imageSrc = ref() -const crossorigin = ref(props.crossorigin) +const crossorigin = ref(props.crossorigin) const hasLoadError = ref(false) const isLoading = ref(true) const showViewer = ref(false)