vue-image-viewer
所属分类:图片显示
开发工具:Less
文件大小:0KB
下载次数:0
上传日期:2022-12-07 23:24:39
上 传 者:
sh-1993
说明: 简单而轻量级的图像查看器。,
(a simple and lightweight image viewer.,)
文件列表:
.babelrc (542, 2021-08-18)
.editorconfig (147, 2021-08-18)
.eslintignore (52, 2021-08-18)
.eslintrc.js (27556, 2021-08-18)
.postcssrc.js (128, 2021-08-18)
LICENSE (1063, 2021-08-18)
build/ (0, 2021-08-18)
build/webpack.config.js (3567, 2021-08-18)
demo/ (0, 2021-08-18)
demo/.babelrc (536, 2021-08-18)
demo/.postcssrc.js (128, 2021-08-18)
demo/build/ (0, 2021-08-18)
demo/build/build.js (1209, 2021-08-18)
demo/build/check-versions.js (1361, 2021-08-18)
demo/build/logo.png (6849, 2021-08-18)
demo/build/utils.js (2571, 2021-08-18)
demo/build/vue-loader.conf.js (598, 2021-08-18)
demo/build/webpack.base.conf.js (2508, 2021-08-18)
demo/build/webpack.dev.conf.js (2863, 2021-08-18)
demo/build/webpack.prod.conf.js (3927, 2021-08-18)
demo/config/ (0, 2021-08-18)
demo/config/dev.env.js (161, 2021-08-18)
demo/config/index.js (927, 2021-08-18)
demo/config/prod.env.js (64, 2021-08-18)
demo/index.html (852, 2021-08-18)
demo/package.json (2282, 2021-08-18)
demo/src/ (0, 2021-08-18)
demo/src/app.vue (2534, 2021-08-18)
demo/src/main.js (234, 2021-08-18)
demo/static/ (0, 2021-08-18)
demo/yarn.lock (268932, 2021-08-18)
dist/ (0, 2021-08-18)
dist/index.html (920, 2021-08-18)
dist/static/ (0, 2021-08-18)
dist/static/css/ (0, 2021-08-18)
dist/static/css/app.css (564, 2021-08-18)
... ...
[![npm version](https://img.shields.io/npm/v/vue-image-viewer.svg?style=flat-square)](https://www.npmjs.com/package/vue-image-viewer)
[![MIT Licence](https://img.shields.io/npm/l/vue-image-viewer.svg?style=flat-square)](https://github.com/chiHai-chuck/vue-image-viewer/blob/master/LICENSE)
# vue-image-viewer
a simple and lightweight picture viewer. [Demo](https://chihai-chuck.github.io/vue-image-viewer/dist/index.html)
>一个用于Vue2.0的简单且轻量化的图片查看器。
# Install
```
npm install vue-image-viewer --save
```
# Usage
```
import imageViewer from "vue-image-viewer";
Vue.use(imageViewer);
export default {
data() {
return {
images : [
{
name : "image1",
url : "/static/images/1.jpg"
},
{
name : "image2",
url : "/static/images/2.png"
},
{
url : "/static/images/3.gif"
}
]
}
},
created() {
this.$imageViewer.images(this.images);
},
methods : {
imageView(index) {
this.$imageViewer.index(index);
this.$imageViewer.show();
}
}
}
```
```
```
# Events
| Name | Params | Type | Description |
|---|---|---|---|
| show | - | - | Open picture viewer. |
| hide | - | - | Close picture viewer. |
| index | `num` | `Number` | Which image to show first. |
| page | `num` | `Number` | The page of the thumbnail list. |
| images | `data` | `Array` | Set image list. |
近期下载者:
相关文件:
收藏者: