React Native中的RefreshContorl下拉刷新使用
我們知道App中都有下拉加載，在React Native中也有類似的控件
一、屬性方法
（1） onRefresh function 在視圖開(kāi)始刷新的時(shí)候調(diào)用
（2） refreshing bool 視圖是否在刷新時(shí)顯示指示器，也表明當(dāng)前是否在刷新中
（3） colors [ColorPropType] android平臺(tái)適用 進(jìn)行設(shè)置加載進(jìn)去指示器的顏色，至少設(shè)置一種，最多可以設(shè)置4種
（4） enabled bool android平臺(tái)適用 用來(lái)設(shè)置下拉刷新功能是否可用
（5） progressBackgroundColor ColorPropType 設(shè)置加載進(jìn)度指示器的背景顏色
（6） size RefreshLayoutConsts.SIZE.DEFAULT android平臺(tái)適用 加載進(jìn)度指示器的尺寸大小
（7） tintColor ColorPropType iOS平臺(tái)適用 設(shè)置加載進(jìn)度指示器的顏色
（8）title string iOS平臺(tái)適用 設(shè)置加載進(jìn)度指示器下面的標(biāo)題文本信息
二、使用方法
<ScrollView
refreshControl={
<RefreshControl
refreshing={this.state.isRefreshing}
onRefresh={this._onRefresh}
tintColor="#ff0000"
title="Loading..."
titleColor="#00ff00"
colors={['#ff0000', '#00ff00', '#0000ff']}
progressBackgroundColor="#ffff00"
/>
}
/>
_onRefresh() {
this.setState({
isRefreshing:true
});
var self = this;
setTimeout(()=>{
//加載數(shù)據(jù)
},2000)
}
這樣就出現(xiàn)加載效果了
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
React Antd中如何設(shè)置表單只輸入數(shù)字
這篇文章主要介紹了React Antd中如何設(shè)置表單只輸入數(shù)字問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06
flouting?ui定位組件完美替代ant?deisgn使用詳解
這篇文章主要為大家介紹了flouting?ui定位組件完美替代ant?deisgn使用詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-11-11
這篇文章主要為大家詳細(xì)介紹了如何基于React封裝一個(gè)層次模糊效果的容器組件,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-03-03
在React應(yīng)用中，為了讓數(shù)據(jù)在組件間共享，常見(jiàn)的方式是讓它們以props的形式自頂向下傳遞，如果數(shù)據(jù)要在組件樹(shù)不同層級(jí)共享，那么這些數(shù)據(jù)必須逐層傳遞直到目的地，Context如同管道，它將數(shù)據(jù)從入口直接傳遞到出口，使用Context能避免“prop-drilling”2023-06-06
React簡(jiǎn)便獲取經(jīng)緯度信息的方法詳解
在現(xiàn)代的Web應(yīng)用程序中,獲取用戶的地理位置信息是一項(xiàng)常見(jiàn)的需求,本文我們將介紹如何在React應(yīng)用程序中簡(jiǎn)便地獲取用戶的經(jīng)緯度信息,需要的可以參考下2023-11-11
這篇文章主要介紹了react如何獲取state的值并更新使用，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-08-08
React類組件中super()和super(props)的區(qū)別詳解
這篇文章給大家詳細(xì)介紹了React類組件中super()和super(props)有什么區(qū)別,文中通過(guò)代碼示例給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下2024-01-01
雖然一直有做react相關(guān)的優(yōu)化,按需加載、dll 分離、服務(wù)端渲染,但是從來(lái)沒(méi)有從路由代碼分割這一塊入手過(guò),所以下面這篇文章主要給大家介紹了關(guān)于React中代碼分割的方式,需要的朋友可以參考下2022-12-12
ForwardRef?useImperativeHandle方法demo
這篇文章主要為大家介紹了ForwardRef?useImperativeHandle方法demo，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-03-03
這篇文章主要介紹了使用Redux處理異步問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03