Vue - 实现 PC 图片全屏放大预览（支持多图、切换、缩放、旋转、放大缩小、拖动、图片标题、键盘关闭、缩放比例、循环查看等等）

前言

您可以以指令式、组件形式、JS 形式进行调用预览图片，插件功能强大且健壮。

本文提供从 0-1 实现 图片全屏预览（支持多图） 功能的详细步骤，并提供使用示例，

另外，支持切换、缩放、旋转、放大缩小等功能，如果您不需要可以关掉。

您可以按照自己的需求进行调整配置及样式，如下图所示：

第一步

注意：如安装使用请改用 cnpm / yarn 进行。

在项目根目录下，执行如下安装命令：

npm install v-viewer --save

第二步

该步骤来注册组件，并且完成配置。

打开项目 main.js 入口文件，加入以下代码：

import Vue from 'vue'