React Native 之 ScrollView的翻到顶部功能

最新推荐文章于 2024-05-25 09:45:20 发布

SnowAnna

最新推荐文章于 2024-05-25 09:45:20 发布

阅读量4.9k

点赞数 2

分类专栏： React-Native

本文链接：https://blog.csdn.net/weixin_38289699/article/details/71218791

版权

本文介绍了在React Native中，当使用ScrollView时，如何处理页面在新内容加载后保持在顶部的问题。通过在ScrollView中添加ref属性并配合自定义方法，可以实现在点击按钮后让页面自动滚动到顶部，提升用户体验。

摘要由CSDN通过智能技术生成

先说明一下使用背景吧==>用ScrollView写的一个页面,页面底部有一个下一篇按钮,但是点击按钮重新render之后,页面依旧在底部,没有自动跳到顶部,视觉效果很差

解决的方法是在ScrollView的标签中加入相当于类名的属性

     
  <ScrollView ref 
  = 
  'totop' 
  > 
 

              
  <View style 
  ={styles.container} 
  > 
 

                
  <View style 
  ={styles.top} 
  >< 
  Text style 
  ={
  { color 
  :  
  '#1eaaca' }} 
  >{this.state.ClassTitle} 
  </ 
  Text 
  ></View 
  > 
 

                
  <View 
  >< 
  Text style 
  ={
  { fontSize 
  :  
  20, lineHeight 
  :  
  60, }} 
  >{this.state.title} 
  </ 
  Text 
  ></View 
  > 
 
 
 

最低0.47元/天解锁文章

SnowAnna

关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
React Native 之 ScrollView的翻到顶部功能

先说明一下使用背景吧==>用ScrollView写的一个页面,页面底部有一个下一篇按钮,但是点击按钮重新render之后,页面依旧在底部,没有自动跳到顶部,视觉效果很差解决的方法是在ScrollView的标签中加入相当于类名的属性 ScrollView ref='totop'> View style={styles.container}>
复制链接

扫一扫

专栏目录