圖片預覽----v-viewer插件的使用

效果：

 

使用：

1、下載插件：npm install v-viewer

2、在需要使用v-viewer的頁面引入

    import 'viewerjs/dist/viewer.css'
    import Viewer from 'v-viewer'
    import Vue from 'vue'
    Vue.use(Viewer)

　　或者全局引入：

　　import 'viewerjs/dist/viewer.css'
　　import Viewer from 'v-viewer'
　　Vue.use(Viewer)

3、如果是一張圖片，可以使用v-viewer指令：

    <div v-viewer>
      <img :src="showImg">
    </div>

　　如果是多種圖片，可以先聲明img數組，使用viewer標簽：

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