node.js - NextJS 在滚动时延迟加载 div 列表

Question

我将如何有效地加载大量 div？我的想法是设置某种延迟加载，在渲染结束时加载 div，并且仅在它们即将进入视图时加载。我想知道我将如何实现这一点。我看了看，react-loadable但这似乎更多地用于导入组件和延迟加载这些组件。

我的设置从 json 列表中读取并映射数据并输出 div。

import list from './file.json'

return (
    {list.map((item) => (
        <div>{item}</div>
    ))}
)

有没有办法实现react-loadable或者这个类似的库可以做我需要的？否则我不知道该怎么做。

标签： node.jsnext.jslazy-loading