小编mor*_*ern的帖子

直到几天前，我对 LazyLoad 的实现运行良好，但现在我似乎无法让它工作。

这是我的组件：

import React from 'react';
import LazyLoad from 'react-lazyload';
import './image.scss';

const Image = image => (

  <LazyLoad height={200} offset={100} once>

    <div
    className="image-container"
    orientation={image.orientation}>    

      <img
      className="image"
      src={image.url}
      alt={image.alt}
      />

      {'caption' in image &&
        <div className="meta">
          <p className="caption">{image.caption}</p>
          <p className="order">{image.currentNumber}/{image.maxNumber}</p>
        </div>
      }

    </div>

  </LazyLoad>  
)

export default Image

在 App.js 中，它是这样调用的：

render() {

        return (
            <div className="wrapper">

                <GalleryTop details={this.state.gallery_top} />

                {this.state.images.map((image, index) => <Image key={index} {...image} /> )}
          </div>
        )
    }

但它不会工作！演示环境如下： https //gifted-kare-1c0eba.netlify.com/

（检查检查器中的网络选项卡以查看所有图像都是从初始加载请求的）

还有一个视频在这里

知道我做错了什么吗？ …