Skip to content
KaImagePreview 图片预览
带加载状态和错误处理的图片预览组件，支持点击放大查看。
使用场景
- 商品图片展示
- 用户头像预览
- 图片画廊
- 附件图片预览
- 缩略图列表
- 相册展示
Props
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
src | string | 必需 | 图片 URL |
class | HTMLAttributes['class'] | - | 自定义 CSS 类 |
Slots
| 名称 | 说明 |
|---|---|
loading | 自定义加载状态内容 |
error | 自定义错误状态内容 |
Events
| 事件名 | 参数 | 说明 |
|---|---|---|
load | - | 图片加载成功时触发 |
error | - | 图片加载失败时触发 |
注意事项
- 点击放大：点击图片会自动打开全屏预览
- 加载状态：图片加载时显示 loading 图标
- 错误处理：加载失败时显示错误图标
- hover 效果：鼠标悬停时图片会轻微放大
- 响应式：建议设置合适的尺寸或使用响应式类