React-infinite-scroll loadMore実行されない

Question

前提・実現したいこと

Reactを用いて現在無限スクロールを実行しようとしています、そこでReact-infinite-scrollを用いて開発をしようと思いました。

しかし、いくつか自分でも解決できない現象が起きて困っています。

1.initialLoad={true}にすると起動時に一気に読み込んでします
数字はpageを表しています、Array()は表示する内容です

2.initialLoad={false}にすると、スクロールしても何も表示されない、ちなみにコンソールも変化なし
3.ページサイズを変更したりすると、たまに表示される

該当のソースコード

**再読み時に実行する関数**
loadMore=(page)=>{
    console.log(page)
    let copyList = [...this.state.list];
        copyList.push(Data[Math.floor(Math.random() * 6) + 1]);
        console.log(copyList)
        this.setState({ list: copyList });
  }

**表示する内容**
 const item =<div className="row">
    {/* 読み込み最中に表示する項目 */}
    {this.state.list.map((value) => (
      <div className="col-6 mt-4">
        <img src={spot} className="w-100">
        </img>
      </div>
    ))}
  </div>

**無限スクロール機能**
<InfiniteScroll
              loadMore={this.loadMore.bind(this)} //項目を読み込む際に処理するコールバック関数
              hasMore={true} //読み込みを行うかどうかの判定
              loader={loader}>
              {item}
</InfiniteScroll>

試したこと

表示する画像サイズや、一度に表示する画像枚数を変更したりしましたが、直りませんでした

ソースコードの不備かと思ったのですが、スクロールをしてもloadMoreが呼び出されていないのが原因だと思います、なぜ呼び出されないのか心あたりのある方いましたら、ご連絡ください。

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

"@material-ui/core": "^4.12.3",
"onsenui": "^2.11.2",
"react-infinite-scroller": "^1.2.4",
"react-onsenui": "^1.11.4"

ここにより詳細な情報を記載してください。