欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

React Native滚动到指定位置

程序员文章站 2022-06-15 23:21:41
...

在构建函数声明一个记录位置的值

constructor(){
	this.positionY = ''
}

既然要滚动,那肯定得将组件放在ScrollView里面啦

<ScrollView ref={ref => this.scrollRef = ref}>
	<View onLayout={e=>{this.positionY = e.nativeEvent.layout.y}}> //这个onLayout方法会在组件渲染的时候执行,
		<Comp/>	//这里可以是任意你想定位的组件,可以是原生组件也可以是自定义组件
	<View>
</ScrollView>

接下来就是滚动函数了

this.refs.scrollRef && 
	this.refs.scrollRef.scrollTo({
                  x: 0,
                  y: this.positionY,
                  animated: true
	});

如果觉得使用View组件来获取指定组件高度会影响你的布局,可以使用Fragment组件或者<></>同样也具有onLayout方法。