vue点击图片放大功能
1、安装配置
npm install v-viewer --save
2、main.js引用
import Viewer from 'v-viewer'
import 'viewerjs/dist/viewer.css'
//Vue.use(Viewer) 默认配置写法
Vue.use(Viewer, {
defaultOptions: {
zIndex: 9999
}
})
3、页面使用
<!-- 图片循环展示 -->
<div class="screen-se">
<viewer :imglist="imglist" class="screen-view">
<img class="screen-img" :src="item" v-for="(item,index ) in imglist" :key="index">
</viewer>
</div>
imglist在data里面定义数组
图片的数据很简单:
'/test/test.png'