react-lazy-image-loading
v1.1.2
Published
--- name: 图片懒加载组件 menu: 组件 --- ### 安装 ``` npm i react-lazy-image-loading ``` ### 使用 ``` import LazyImg from "react-lazy-image-loading"; ``` ### API
Downloads
2
Maintainers
Readme
name: 图片懒加载组件 menu: 组件
安装
npm i react-lazy-image-loading
使用
import LazyImg from "react-lazy-image-loading";
API
| 属性 | 说明 | 类型 | 默认值 | | ---- | ---- | ---- | ------ | | src | 图片路径 | string | 必填 | | placeholderSrc | 占位图片路径 | string | 为你推荐更好的.png | | className | className | string | 无 | | width | 图片宽度 | string、number | 无 | | height | 图片高度 | string、number | 无 | | style | 图片样式 | React.CSSProperties | 无 | | sizes | 图片裁剪大小 | string _310x310.xxx | '' | | alt | 图片加载失败提示信息 | string | '' | | webp | 图片是否需要开启webp格式 | boolean | false | | errSrc | 图片加载失败显示的图片src | srting | | | threshold | 图片出现在视窗的百分比(列:0.2,图片出现了百分之20的时候 开始加载真实图片) | number | 0.2 | | onError | 错误处理程序 | (e:any) => void | (e) => {e.target.onerror = null;e.target.src= errSrc;} |