0.2.2 • Published 4 years ago

vue-photo-zoomer v0.2.2

Weekly downloads
1
License
MIT
Repository
github
Last release
4 years ago

vue-photo-zoomer

Build Status Coverage Status license language

基于vue2.x设计的图片放大镜组件。

DEMO

<template>
  <div class="zoomer-x">
    <VuePhotoZoomer
      :url="demoImg"
      :style="{
        width: '500px'
      }"
    />
  </div>
</template>

<script>
import VuePhotoZoomer from 'vue-photo-zoomer'
import demoImg from './assets/demo.jpg'
export default {
  name: 'App',
  components: {
    VuePhotoZoomer
  },
  data () {
    return {
      demoImg
    }
  }
}
</script>
<style>
.zoomer-x {
  text-align: center;
}
</style>

示例

Props

参数说明类型默认值
url图片的URLString-
urlFull放大后的图片URLStringurl
scale放大倍数Number2
viewerStyle观察区域的样式Object-
magnifierStyle放大镜的样式Object-

Slots

名称说明
loading图片加载时的内容