---
url: /components/image-viewer.md
---
# ImageViewer 图片预览

全屏图片预览：多图切换、缩放、旋转；[Image](/components/image) 的放大预览即由它承载，也可独立挂在自己的触发器上。

## 基础用法

`v-model` 控制显隐，`url-list` 传入图片组，工具条支持缩放与旋转：

## 指定初始图与切换回调

`initial-index` 指定打开时的图片；翻页时触发 `switch`：

## 键盘操作

打开预览后焦点自动移入查看器（关闭时归还原焦点），操作按钮均为原生 button 可 Tab 聚焦：`←` / `→` 切换上一张/下一张，`Esc` 关闭（可用 `close-on-press-escape` 关闭），`+` / `-` 缩放，`0` 重置缩放与旋转。预览打开期间页面滚动被锁定，关闭后恢复。
