bee-viewer
Viewer ui component for react
Last updated 2 years ago by liushaozhen .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install bee-viewer 
SYNC missed versions from official npm registry.

bee-viewer

npm version Build Status Coverage Status devDependency Status NPM downloads Average time to resolve an issue Percentage of issues still open

react bee-viewer component for tinper-bee

some description...

依赖

  • react >= 15.3.0
  • react-dom >= 15.3.0
  • prop-types >= 15.6.0

使用方法


import React, { Component } from 'react';
import Viewer from '../../src'

class Demo1 extends Component {

    shown=(e)=>{
        console.log(e,'shwon')
    }
    hidden=(e)=>{
        console.log(e,'hidden')
    }
    render () {
        return (
            <Viewer shown={this.shown} hidden={this.hidden}>
                <img id="image" src='http://design.yonyoucloud.com/static/bee.tinper.org-demo/swiper-demo-1-min.jpg' alt="Picture"/>
            </Viewer>
        )
    }
}
export default Demo1

API

参数 说明 类型 默认值
asyncLoad 图片是否异步加载 bool false
inline 启用 inline 模式 bool false
button 显示右上角关闭按钮 bool true
navbar 显示缩略图导航 bool true
title 显示当前图片的alt属性及图片尺寸 bool true
toolbar 显示工具栏 bool true
tooltip 显示缩放百分比 bool true
movable 图片是否可移动 bool true
zoomable 图片是否可缩放 bool true
rotatable 图片是否可旋转 bool true
scalable 图片是否可翻转 bool true
transition 使用 CSS3 过度 bool true
fullscreen 播放时是否全屏 bool true
keyboard 是否支持键盘 bool true
interval 播放间隔,单位为毫秒 number 5000
zoomRatio 鼠标滚动时的缩放比例 number 0.1
minZoomRatio 最小缩放比例 number 0.01
maxZoomRatio 最大缩放比例 number 100
zIndex 设置图片查看器 modal 模式时的 z-index number 2015
zIndexInline 设置图片查看器 inline 模式时的 z-index number 0
container 设置图片查看器 modal 模式的容器,inline 模式无效 element body
shown 图片查看器显示后的回调 func ()=>{}
hidden 图片查看器关闭后的回调 func ()=>{}

开发调试

$ npm install -g bee-tools
$ git clone https://github.com/tinper-bee/bee-viewer
$ cd bee-viewer
$ npm install
$ npm run dev

Current Tags

  • 0.1.7                                ...           latest (7 months ago)

6 Versions

  • 0.1.7                                ...           7 months ago
  • 0.1.6                                ...           2 years ago
  • 0.1.5                                ...           2 years ago
  • 0.1.4                                ...           2 years ago
  • 0.1.3                                ...           2 years ago
  • 0.1.2                                ...           2 years ago
Downloads
Today 2
This Week 8
This Month 58
Last Day 1
Last Week 10
Last Month 97
Dependencies (4)
Dev Dependencies (13)

Copyright 2014 - 2017 © taobao.org |