ユーザーがスクロールしている方向を知る方法ScrollView
。方向に基づいてアクションボタンを表示したい。次のコードで方向を見つけようとしています。
import React, {Component} from 'react'
import { StyleSheet, Alert, ScrollView, View, Text } from 'react-native'
class ScrollDirection extends Component {
constructor(props){
super(props);
this.state = {
offset: 0
}
}
onScroll(event){
var currentOffset = event.nativeEvent.contentOffset.y;
var direction = currentOffset > this.offset ? 'down' : 'up';
this.state.offset = currentOffset;
Alert.alert(direction);
}
render() {
return (
<View style={styles.container}>
<ScrollView onScroll={this.onScroll}>
<View style={styles.scroller}>
<Text style={{fontSize:20,}}>ScrollDirection</Text>
</View>
</ScrollView>
</View>
)
}
}
var styles = StyleSheet.create({
container: {
flex: 1,
marginTop: 50,
},
scroller: {
height: 5000,
},
});
export default ScrollDirection;
したがって、スクロールアップではアラートアップを、スクロールダウンではアラートダウンをアラートしたいと思います。しかし、次のエラーが発生します。
私は何を間違っていますか?または、それを行うより良い方法はありますか?
どうもありがとう!
更新 1:
state.offset を object に変更し、バインドしonScroll
て onScroll 関数を setState に変更しました。
constructor(props){
super(props);
this.state = {
offset: {}
}
this.onScroll = this.onScroll.bind(this)
}
onScroll(event){
var currentOffset = event.nativeEvent.contentOffset.y;
var direction = currentOffset > this.state.offset ? 'down' : 'up';
this.setState({
offset : currentOffset.y
}),
Alert.alert(direction);
}
しかし、どちらの方向にスクロールしても、アラートがup
. 私は何が欠けていますか?