第一步:创建一个LazyLoad文件,在哪里创建都可以,以下代码复制进去即可;
import React from 'react'
const threshold = [0.01]
class LazyLoad extends React.Component{
constructor(props){
super(props)
this.state = {
io: null,
refs: null,
images: null,
loading: true
}
this.handleonload = this.handleonload.bind(this)
}
UNSAFE_componentWillMount(){
var {ImgClassName, src, alt, ImgStyle ,datasrc} = this.props.state
ImgClassName = ImgClassName ? ImgClassName : 'lazyload-img'
alt = alt ? alt : 'antd-lazyload'
var images = []
var refs = []
const ref = React.createRef()
refs.push(ref)
images.push(
//这是图片显示和默认显示
<img className={ImgClassName} ref={ref} data-src={datasrc} src={src} style={
{...ImgS