react-lazy-load

基于react的图片懒加载

/***
 *
 *
 *                                                    __----~~~~~~~~~~~------___
 *                                   .  .   ~~//====......          __--~ ~~
 *                   -.            \_|//     |||\\  ~~~~~~::::... /~
 *                ___-==_       _-~o~  \/    |||  \\            _/~~-
 *        __---~~~.==~||\=_    -_--~/_-~|-   |\\   \\        _/~
 *    _-~~     .=~    |  \\-_    '-~7  /-   /  ||    \      /
 *  .~       .~       |   \\ -_    /  /-   /   ||      \   /
 * /  ____  /         |     \\ ~-_/  /|- _/   .||       \ /
 * |~~    ~~|--~~~~--_ \     ~==-/   | \~--===~~        .\
 *          '         ~-|      /|    |-~\~~       __--~~
 *                      |-~~-_/ |    |   ~\_   _-~            /\
 *                           /  \     \__   \/~                \__
 *                       _--~ _/ | .-~~____--~-/                  ~~==.
 *                      ((->/~   '.|||' -_|    ~~-/ ,              . _||
 *                                 -_     ~\      ~~---l__i__i__i--~~_/
 *                                 _-~-__   ~)  \--______________--~~
 *                               //.-~~~-~_--~- |-------~~~~~~~~
 *                                      //.-~~~--\
 *                               神兽保佑
 *                              代码无BUG!
 */

简介

component文件夹

react图片懒加载组件源码

page文件夹

组件具体使用方法及demo

parmas

属性名	数据类型	属性介绍	默认值
fatherRef	string	最外层的ref	fatherRef
className	string或者模块化css类	自定义类名	""
style	object	自定义样式	{}
link	string	标签中存真实地址的属性名	data-original
interval	number	懒加载节流间隔	100
distance	number	距离浏览器底部多少px的时候加载图片	0

ps

暂时懒得发npm包，可以自行去"src/component/react-lazy-load.jsx"下载源码使用
也可以项目整下来npm install 之后 npm run build使用构建好的代码
具体使用方法见"page/index.jsx"