插件名称 | v-viewer |
---|---|
版本号 | v1.6.3 |
发布时间 | 2020年12月31日 |
插件作者 | mirari |
用于图片浏览的Vue组件,支持旋转、缩放、翻转等操作,基于viewer.js。
npm install v-viewer
引入v-viewer
及必需的css样式,并使用Vue.use()
注册插件,之后即可使用。
<template>
<div id="app">
<!-- directive -->
<div class="images" v-viewer>
<img src="1.jpg">
<img src="2.jpg">
...
</div>
<!-- component -->
<viewer :images="images">
<img v-for="src in images" :src="src" :key="src">
</viewer>
</div>
</template>
<script>
import 'viewerjs/dist/viewer.css'
import Viewer from 'v-viewer'
import Vue from 'vue'
Vue.use(Viewer)
export default {
data() {
images: ['1.jpg', '2.jpg']
}
}
</script>
v1.6.3 (06/02/2021)