当前位置: 首页 > 工具软件 > ViewerJS > 使用案例 >

关于viewerjs的使用

闻人英韶
2023-12-01

场景应用于图片局部缩放功能(可缩放,拖拽,旋转,切换)

操作如下

npm install viewerjs

第二步 在main.js 配置

import Viewer from 'v-viewer'
import 'viewerjs/dist/viewer.css'

//Vue.use(Viewer) 默认配置写法
Vue.use(Viewer, {
    defaultOptions: {
        zIndex: 9999
    }
})

第三步 使用

 <viewer>
    <img :src="images" alt="" class="imglist">
 </viewer>

图片来源于后台数据请求,这里是一张图片的使用,多张图的话,在vue中大家可以用 v-for来循环。

我是947,一个爱分享的前端菜鸟,希望大家多多指教!

 类似资料: