Image 图片
用于展示图片资源，支持可选预览能力。
基础用法
基础图片
适应方式
object-fit 变体
cover（裁切填充）
contain（完整显示）
通过 fit 设置 object-fit，再配合 ::part(image) 固定图片容器尺寸实现裁切效果。
占位与兜底
加载占位
设置 placeholder 后，图片加载完成前显示浅灰占位；加载完成后自动切换为图片。
加载失败兜底
默认失败占位
自定义兜底图
图片加载失败时默认显示「图片加载失败」占位；提供 fallback 属性可指定兜底图片地址，兜底图也失败时回退到占位文案。
懒加载
懒加载长列表（滚动逐图加载）
设置 lazy 后图片进入视口才发起加载；配合 placeholder 展示「加载中」占位。向下滚动列表，观察占位 → 加载的过渡（视口内图片立即加载）。
预览
点击预览（内置浮层）
点击图片打开全屏预览浮层：工具栏支持放大/缩小/旋转/下载，Esc 或点击遮罩关闭；打开时聚焦关闭按钮，关闭后还原焦点。派发 oas-preview 事件（detail 含 src）。
API
属性
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
alt | 替代文本 | — | — |
fallback | 加载失败时切换的兜底图地址；未设置则显示「图片加载失败」占位 | string | — |
fit | object-fit 值 | string | — |
lazy | 懒加载：图片进入视口才发起加载（IntersectionObserver）；已位于视口内立即加载；环境不支持时退化为立即加载 | boolean | — |
placeholder | 加载完成前显示浅灰占位 | boolean | — |
preview | 开启内置预览：点击放大 + 缩放/旋转/下载 + Esc 关闭 + 焦点陷阱 | boolean | — |
src | 图片地址 | string | — |
事件
| 事件 | 说明 |
|---|---|
oas-preview | 打开预览浮层，detail: { src }；浮层关闭不派发事件 |