vue好用的图片查看器(v-viewer插件)

最新推荐文章于 2024-07-10 00:09:20 发布

weixin_30596165

最新推荐文章于 2024-07-10 00:09:20 发布

阅读量2.8k

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/jf-67/p/10304691.html

版权

　在开发中，经常会遇到这样的需求，就是点击图片，能够放大预览。在网上找到了一款很好用的插件。拿来即用，不需要复杂的配置。特此记录下（这里只是针对于在vue脚手架下的使用方法）。

　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、在需要使用图片查看的文件中使用如下：

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

　　上面的images是一个数组，用来存放需要预览的图片的路径的。

转载于:https://www.cnblogs.com/jf-67/p/10304691.html

关注