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'
最后
以上就是多情咖啡豆最近收集整理的关于vue点击图片放大功能的全部内容，更多相关vue点击图片放大功能内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。
发表评论 取消回复