[RN] React Native 图片懒加载库 animated-lazy-image

时间:2023-02-15 19:50:08

React Native 图片懒加载库 animated-lazy-image

官方Github地址:

https://github.com/danijelgrabez/lazy-image

使用效果:

[RN] React Native 图片懒加载库 animated-lazy-image

一、安装依赖

npm i animated-lazy-image -S

yarn add animated-lazy-image

二、使用

import LazyImage from 'animated-lazy-image';

  /**
* Base example
*/
<LazyImage
source="https://images.unsplash.com/photo-1551148552-c19ee5b0c116?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2733&q=80"
/> /**
* With custom placeholder background color
*/
<LazyImage
source="https://images.unsplash.com/photo-1551148552-c19ee5b0c116?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2733&q=80"
placeholderColor="#f74b59"
/> /**
* With custom placeholder component
*/
<LazyImage
source="https://images.unsplash.com/photo-1551148552-c19ee5b0c116?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2733&q=80"
customPlaceholder={<CustomComponent />}
/>

本博客地址: wukong1688

本文原文地址:https://www.cnblogs.com/wukong1688/p/10892628.html

转载请著名出处!谢谢~~