# big-img

> bigimg

Latest version **1.0.12** (published 2018-09-27) · ISC license · 0 weekly downloads

## Install

```sh
npm install big-img
pnpm add big-img
yarn add big-img
bun add big-img
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.12 |
| Published | 2018-09-27 |
| First published | 2018-09-27 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 41.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | lihheng |
| Maintainers | hengheng-vistar |
| Keywords | bigimg |

## Links

- npm: https://www.npmjs.com/package/big-img
- npm.io page: https://npm.io/package/big-img

## Alternatives

- [random-seedable](https://npm.io/package/random-seedable.md) — 27.9K weekly downloads
- [n2words](https://npm.io/package/n2words.md) — 22.2K weekly downloads
- [@stdlib/math-base-special-factorialln](https://npm.io/package/@stdlib/math-base-special-factorialln.md) — 5.7K weekly downloads
- [@stdlib/math-base-special-abs2](https://npm.io/package/@stdlib/math-base-special-abs2.md) — 1.7K weekly downloads
- [commons-math-interpolation](https://npm.io/package/commons-math-interpolation.md) — 1.4K weekly downloads

## Recent versions

- 1.0.12 (latest) — 2018-09-27

## README

##datepicker

>des 点击小图看大图

##code block
```
import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import style from './BigImg.css';

/**
 * create by liheng at 2016.12.12
 * <BigImg />
 * imgArr=[{
 *      path:"",
        id:""
    }]
 * 弹框播放图片资源
 */
class BigImg extends Component{
    constructor(props){
        super(props);
        this.state={
            imgArr:props.imgArr||[],
            currentIndex:props.currentIndex||0
        }
    }
    render() {
        let currentPath = this.state.imgArr[this.state.currentIndex]['path'];

        return (
            <div className={style["bigimg__box"]} ref="bigimg">
                <div className={style["bigimg__shade"]} onClick={e=>this.unMount()}></div>
                <div className={style["bigimg__content"]}>

                    <img src={currentPath} alt="" className={style['show__img']}/>
                    {/*上下一页*/}
                    <span className={style["pre__img"]} onClick={e=>this.setCurrentImg('pre')}></span>
                    <span className={style["next__img"]} onClick={e=>this.setCurrentImg('next')}></span>
                </div>
            </div>
        );
    }
    setCurrentImg(type){
        let {currentIndex,imgArr=[]} = this.state;
        let maxLen = imgArr.length,index='';

        switch(type){
            case 'pre':
                index = currentIndex - 1 < 0 ? currentIndex : currentIndex - 1;
                break;
            case 'next':
                index = currentIndex + 1 == maxLen? currentIndex : currentIndex + 1;
                break     
            default:
                break;
        }

        this.setState({
            currentIndex:index
        })
    }
    unMount(){
        let mountNode = ReactDOM.findDOMNode(this.refs.bigimg);

        mountNode.parentNode.removeChild(mountNode);

    }

}

export  default function BigImg(imgArr=[],index=0){
    let imgRoot = document.createElement('div');
    document.body.appendChild(imgRoot);

    ReactDOM.render(<BigImg imgArr={imgArr} currentIndex={index}/>,imgRoot);
} 

```

---
_Source: https://npm.io/package/big-img · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
