mirror of
https://github.com/element-plus/element-plus.git
synced 2026-03-13 07:51:17 +08:00
52d89cc06d
* 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>
123 lines
2.9 KiB
TypeScript
123 lines
2.9 KiB
TypeScript
import {
|
|
buildProps,
|
|
definePropType,
|
|
isNumber,
|
|
mutable,
|
|
} from '@element-plus/utils'
|
|
|
|
import type { ExtractPropTypes } from 'vue'
|
|
|
|
export const imageProps = buildProps({
|
|
/**
|
|
* @description when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode.
|
|
*/
|
|
hideOnClickModal: Boolean,
|
|
/**
|
|
* @description image source, same as native.
|
|
*/
|
|
src: {
|
|
type: String,
|
|
default: '',
|
|
},
|
|
/**
|
|
* @description 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).
|
|
*/
|
|
fit: {
|
|
type: String,
|
|
values: ['', 'contain', 'cover', 'fill', 'none', 'scale-down'],
|
|
default: '',
|
|
},
|
|
/**
|
|
* @description Indicates how the browser should load the image, same as [native](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-loading)
|
|
*/
|
|
loading: {
|
|
type: String,
|
|
values: ['eager', 'lazy'],
|
|
},
|
|
/**
|
|
* @description whether to use lazy load.
|
|
*/
|
|
lazy: Boolean,
|
|
/**
|
|
* @description the container to add scroll listener when using lazy load.
|
|
*/
|
|
scrollContainer: {
|
|
type: definePropType<string | HTMLElement | undefined>([String, Object]),
|
|
},
|
|
/**
|
|
* @description allow big image preview.
|
|
*/
|
|
previewSrcList: {
|
|
type: definePropType<string[]>(Array),
|
|
default: () => mutable([] as const),
|
|
},
|
|
/**
|
|
* @description whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`.
|
|
*/
|
|
previewTeleported: Boolean,
|
|
/**
|
|
* @description set image preview z-index.
|
|
*/
|
|
zIndex: {
|
|
type: Number,
|
|
},
|
|
/**
|
|
* @description initial preview image index, less than the length of `url-list`.
|
|
*/
|
|
initialIndex: {
|
|
type: Number,
|
|
default: 0,
|
|
},
|
|
/**
|
|
* @description whether the viewer preview is infinite.
|
|
*/
|
|
infinite: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
/**
|
|
* @description whether the image-viewer can be closed by pressing ESC.
|
|
*/
|
|
closeOnPressEscape: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
/**
|
|
* @description the zoom rate of the image viewer zoom event
|
|
*/
|
|
zoomRate: {
|
|
type: Number,
|
|
default: 1.2,
|
|
},
|
|
/**
|
|
* @description the min scale of the image viewer zoom event.
|
|
*/
|
|
minScale: {
|
|
type: Number,
|
|
default: 0.2,
|
|
},
|
|
/**
|
|
* @description the max scale of the image viewer zoom event.
|
|
*/
|
|
maxScale: {
|
|
type: Number,
|
|
default: 7,
|
|
},
|
|
/**
|
|
* @description set HTML attribute: crossorigin.
|
|
*/
|
|
crossorigin: {
|
|
type: definePropType<'anonymous' | 'use-credentials' | ''>(String),
|
|
},
|
|
} as const)
|
|
export type ImageProps = ExtractPropTypes<typeof imageProps>
|
|
|
|
export const imageEmits = {
|
|
load: (evt: Event) => evt instanceof Event,
|
|
error: (evt: Event) => evt instanceof Event,
|
|
switch: (val: number) => isNumber(val),
|
|
close: () => true,
|
|
show: () => true,
|
|
}
|
|
export type ImageEmits = typeof imageEmits
|