vue 图片-点击放大预览-好用的插件-v-viewer

1. 安装依赖

cnpm install --save-dev v-viewer

2. main.js 引用

import Viewer from 'v-viewer' 
import 'viewerjs/dist/viewer.css'
Vue.use(Viewer, {
  defaultOptions: {
    zIndex: 9999,
    title: false, //显示标题
    navbar: false,
    toolbar: {
      zoomIn: 1,
      zoomOut: 1,
      reset: 1,
      oneToOne: 1,
      rotateRight: 1,
      rotateLeft: 1,
    }
  }
})

3. 页面组件中使用，images必须是一个数组，数组内直接放入图片链接即可

<viewer :images="images">                
	<img :src="getObjectURL(value)" />
</viewer>

参考：https://zhuanlan.zhihu.com/p/55117558