v-viewerv-viewer @1.6.4 "v-viewer": "^1.6.4" 使用，由于全局注册v-view

v-viewer @1.6.4

"v-viewer": "^1.6.4"

使用

全局注册：
import 'viewerjs/dist/viewer.css';
import VueViewer from 'v-viewer';

let options = {
  defaultOptions: {
    zIndex: 99999,
    title: false,
    toolbar: true,
    zoomable: true, // 启用以缩放图像
    rotatable: true, // 启用以旋转图像
    scalable: true, // 启用以缩放图像。
    keyboard: true // 启用键盘支持。
  }
};
Vue.use(VueViewer, options);

<a-tooltip
 :mouseLeaveDelay="0.1"
 placement="top"
 trigger="hover|click"
 @click="viewPic(record)"
>
 <template slot="title">查看证件</template>
 <span>
  <a href="#" type="link" style="color: #3296fa">
   {{ text }}
  </a>
 </span>
</a-tooltip>

//通过API调用 （推荐使用）
//查看图片
viewPic(row) {
   this.$viewerApi({ images: [row.picUrl] });
},

由于全局注册v-viewer，组件、指令和api会被一起安装到app全局，可直接获取并使用全局变量 $viewerApi