共计 522 个字符,预计需要花费 2 分钟才能阅读完成。
劣势
- 整个组件只有两个监听事件
- 反对 one-time 和 continue 两种懒加载模式
- scroll 和 resize 办法通过 throttle 解决,也能够切换为 debounce 模式
- 反对装璜器
- 对服务端渲染敌对
- 通过严格的测试
应用办法
import React from 'react'; | |
import ReactDOM from 'react-dom'; | |
import LazyLoad from 'react-lazyload'; | |
import MyComponent from './MyComponent'; | |
const App = () => { | |
return ( | |
<div className="list"> | |
<LazyLoad height={200}> | |
<img src="tiger.jpg" /> | |
</LazyLoad> | |
<LazyLoad height={200} once > | |
<MyComponent /> | |
</LazyLoad> | |
<LazyLoad height={200} offset={100}> | |
<MyComponent /> | |
</LazyLoad> | |
<LazyLoad> | |
<MyComponent /> | |
</LazyLoad> | |
</div> | |
); | |
}; | |
ReactDOM.render(<App />, document.body); |
正文完