图片

介绍
需要查看图片的时候,简单的设置 src 属性,就能获得一个有预览图片功能的组件。
API
Props
| 参数名 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| status | 默认状态 | 'default'|'hide' | 'default' |
| src | 图片地址 | string | - |
| title | 标题 | string | - |
| description | 底部描述 | string | - |
| alt | 加载失败文字提示 | string | - |
| hideFooter | 隐藏底部内容 | boolean | false |
| footerPosition | 底部内容显示位置 | 'inner'|'outer' | 'inner' |
| showLoader | 加载效果 | boolean | false |
| preview | 开启预览 | boolean | true |
| previewVisible | 预览打开状态 | boolean | false |
| baseStyle | 自定义样式 | string | - |
| customClass | 类名绑定 , 绑定类的名称 | string | - |
| width | 宽度 | {value:number,unit:'px'|'%'} | {value:120,unit:'px'} |
| height | 高度 | {value:number,unit:'px'|'%'} | {value:50,unit:'px'} |
| fit | 填充模式 | 'fill'|'cover'|'contain' | 'fill' |
| uniqueKey | 唯一标识 , 组件的唯一标识 | string | - |
| name | 唯一标识 , 图片的唯一标识 | string | - |
| loop | 循环 , 循环渲染设置 | Loop | - |
Events
| 事件名 | 描述 | 参数 |
|---|---|---|
| onPreviewChange | 点击时触发 | ctx params:boolean |
Type
js
// 循环
type Loop = {
"data": any[],
"paramName": string,
"indexName": string,
"key": string
}