ri
react-imageview
npm i react-imageview
ri

react-imageview

react imageview(H5 react图片查看器)

by zekai

1.2.1 (see all)License:MITTypeScript:Not Found
npm i react-imageview
Readme

react-imageview

Imageview component built with react

Demo

You can find demo in folder example

Usage with React

1、Install the package

npm install react-imageview --save

2、Using as your need

// Example 1:

import React, { Component } from 'react'
import ImageView from 'react-imageview'

import 'react-imageview/dist/react-imageview.min.css'

class Main extends Component {
    state = {
        showViewer: false
    }
    render() {
        const imagelist = ['./1.png','./2.png','./3.png','./4.png']
        return (
            <div>
                {
                    !!this.state.showViewer && <ImageView imagelist={imagelist} />
                }
                <button onClick={e=>this.show()}>click me to show Alert</button>
            </div>
        )
    }
    show() {
        this.setState({
            showViewer: true
        })
    }
}

// Example 2:

import { SingleImgView } from 'react-imageview'
import 'react-imageview/dist/react-imageview.min.css'

// You can call SingleImgView.show anywhere and anytime, there will be only one View DOM node be added.

const imagelist = ['./1.png','./2.png','./3.png','./4.png']
SingleImgView.show({ imagelist });

Configuration

ParamTypeDescription
imagelistarrayThe list of images to view
disablePinchboolDisable pinch function
disableRotateboolDisable rotate function
disableDoubleTapboolDisable double tap function
longTapfunctionEvents called after the long tap

License

Copyright(c) 2016-2017 AlloyTeam. Licensed under MIT license.

Downloads/wk

12

GitHub Stars

13

LAST COMMIT

6yrs ago

MAINTAINERS

1

CONTRIBUTORS

1

OPEN ISSUES

1

OPEN PRs

0
VersionTagPublished
1.2.1
latest
6yrs ago
No alternatives found
No tutorials found
Add a tutorial
No dependencies found

Rate & Review

100
No reviews found
Be the first to rate