怎么在vue中利用viewer实现一个图片查看器

怎么在vue中利用viewer实现一个图片查看器？很多新手对此不是很清楚，为了帮助大家解决这个难题，下面小编将为大家详细讲解，有这方面需求的人可以来学习下，希望你能有所收获。

创新互联公司成立10年来，这条路我们正越走越好，积累了技术与客户资源，形成了良好的口碑。为客户提供做网站、网站建设、网站策划、网页设计、域名申请、网络营销、VI设计、网站改版、漏洞修补等服务。网站是否美观、功能强大、用户体验好、性价比高、打开快等等，这些对于网站建设都非常重要，创新互联公司通过对建站技术性的掌握、对创意设计的研究为客户提供一站式互联网解决方案，携手广大客户，共同发展进步。

为什么要使用Vue

Vue是一款友好的、多用途且高性能的JavaScript框架，使用vue可以创建可维护性和可测试性更强的代码库，Vue允许可以将一个网页分割成可复用的组件，每个组件都包含属于自己的HTML、CSS、JavaScript，以用来渲染网页中相应的地方，所以越来越多的前端开发者使用vue。

vue2-viewer

vue2-viewer 是一款强大的图像浏览插件，可以实现图像的放大预览，旋转，任意比例放大和缩小等功能

使用文档

安装

npm install --save vue2-viewer

在main.js中引入并使用插件

import ImageViewer from 'vue2-viewer';
Vue.use(ImageViewer);

插件会在全局注册vue-viewer组件

使用组件

vue2-viewer 提供两种使用模式，单图片模式和多图列表模式。

单图片模式

props

示例：

效果展示：

多图片模式

props

Scoped Slot

示例：

 
 
 ×
 

看完上述内容是否对您有帮助呢？如果还想对相关知识有进一步的了解或阅读更多相关文章，请关注创新互联行业资讯频道，感谢您对创新互联的支持。