vue好用的圖片查看器(v-viewer插件)

　在開發中，經常會遇到這樣的需求，就是點擊圖片，能夠放大預覽。在網上找到了一款很好用的插件。拿來即用，不需要復雜的配置。特此記錄下（這里只是針對於在vue腳手架下的使用方法）。

　1、安裝依賴包。

npm install v-viewer --save

 

　　2、在main.js中配置如下：　

import Viewer from 'v-viewer'
import 'viewerjs/dist/viewer.css' Vue.use(Viewer, { defaultOptions: { zIndex: 9999 } })

 

　　3、在需要使用圖片查看的文件中使用如下：

<viewer :images="images">
    <img v-for="src in images" :src="src" :key="src">
</viewer>

　　上面的images是一個數組，用來存放需要預覽的圖片的路徑的。