美文网首页程序员React Native学习
react native 下拉刷新的实现

react native 下拉刷新的实现

作者: JsLin_ | 来源:发表于2018-10-11 11:30 被阅读32次
6549B36D6E6BE977223B7F6C42965AE3.jpg image.png

ios会有个上拉的距离底部的距离
这里加了个上拉特效,上拉的时候可以给个温馨提示,或者给个背景图gif都是可以的。
下拉刷新代码:

_onRefresh()=()=>{
   //下拉刷新的代码
}
//ScrollView  外部可以绝对定位,加一些上拉特效 文字等

 <ScrollView
          showsVerticalScrollIndicator={false}
          refreshControl={
            <RefreshControl
              title={'下拉刷新'}
              refreshing={this.state.refreshing}
             colors={['rgb(255, 176, 0)',"#ffb100"]}
              onRefresh={() => {
                this._onRefresh();
              }}
            />
          }
        >

          // 要刷新的  内容  展示

</ScrollView>

相关文章

网友评论

    本文标题:react native 下拉刷新的实现

    本文链接:https://www.haomeiwen.com/subject/gstbaftx.html