-
前端公共组件 components
-
- iv-view-image (全屏图片预览)
-
配合iview跑马灯实现图片预览,组件存放路径 src/components/iv-view-image
在http://localhost:8080/viewImage,可以查看demo演示
// 文件内直接使用
<iv-view-img />
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
interval | 自动播放间隔时间 | Number | 3000 |
value | 控制显示或隐藏,可用v-model | Boolean | false |
view-value | 从索引开始显示图片 | number | 0 |
toolbar | 是否在顶部显示title | [Boolean, Number] | true |
title | 图片名字显示 | [Boolean, Number] | true |
navbar | 导航栏显示 | [Boolean, Number] | true |
minZoomRatio | 最小缩放比例 | Number | 0.1 |
详细看: https://github.com/fengyuanchen/viewerjs#options
属性 | 说明 | 返回值 |
---|---|---|
on-close | 关闭右上角事件 | 图片组件实例 |
on-change | 切换图片时触发,激活的索引,原索引,当前data对象,图片实例 | oldValue, value, itme, this |
属性 | 说明 |
---|---|
fixRight | 自定义右上角关闭内容 |
noDataSlot | 当data数据为空时自定义内容 |
编辑:zhanfei2024