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.在vue文件中使用时

用法:

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

只要img中传入对应的src即可
images是图片地址数组 [1,2,3,4…]

效果图

在这里插入图片描述

Logo

前往低代码交流专区

更多推荐