vue iview多张图片大图预览、缩放翻转

前端  /  管理员 发布于 4年前   765

本文实例为大家分享了vue iview多张图片大图预览，可缩放翻转，供大家参考，具体内容如下

先看效果：

完整项目代码地址

具体代码如下：

可以看到，这个图片大图预览是用js创建的，而且是在main元素下添加的元素。因为这个是在ivew-admin框架下写的，其主要内容区的z-index是比菜单和header小的，所以如果在内容去写这个图片全局预览阴影区域无法覆盖整个页面。所以需要在main下加入元素。

组件方式：

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

您可能感兴趣的文章:

• 使用VUE+iView+.Net Core上传图片的方法示例
• Vue.js 2.0 移动端拍照压缩图片上传预览功能
• vue.js 图片上传并预览及图片更换功能的实现代码
• vue.js图片转Base64上传图片并预览的实现方法
• vue2实现移动端上传、预览、压缩图片解决拍照旋转问题
• Vue.js 2.0 移动端拍照压缩图片预览及上传实例
• 基于Vue2x的图片预览插件的示例代码
• Vue.js图片预览插件使用详解
• vue2.0 使用element-ui里的upload组件实现图片预览效果方法
• vue.js 实现图片本地预览 裁剪 压缩 上传功能