image-ipreview-box
v2.0.2
Published
A image preview plugin for Vue.js.
Downloads
2
Maintainers
Readme
image-ipreview
一款基于vue的桌面端轻量图片预览插件。 1.欢迎大家使用~,觉得还行的,恳请给个star,谢谢! 2.如有问题,请提issue,我会持续迭代。
特性
1.支持缩放,旋转,原图查看等
2.支持鼠标滚轮缩放
3.自带节流机制,兼顾性能
4.支持鼠标拖动预览图查看
安装
npm install image-ipreview
用法
import ImageIpreview from 'image-ipreview';
import 'image-ipreview/lib/image-ipreview.css';
Vue.use(ImageIpreview);
// 组件中使用实例
...
<template>
<div id="app">
<image-ipreview
:url="require('./assets/demo.png')"
:isMouseWheel="true"
:isShowToolBar="true"
:closeOnPressEscape="true"
/>
</div>
</template>
...
配置
| 属性名 | 类型 | 描述 | 是否必填 | 默认值 | | :----------------: | :-----: | :-----------: | :----: | ------ | | url | string | 图片地址 | 是 | | | closeOnPressEscape | boolean | esc键关闭预览 | - | true | | isShowToolBar | boolean | 是否展示工具栏 | - | true | | isMouseWheel | boolean | 是否开启鼠标滚轮缩放 | - | false |
效果