Reagieren nativer bestimmen, ob Benutzer am oberen Rand des Bildschirms

Question

In Javascript in Web ist, würde ich so etwas tun, um zu bestimmen, wenn der Benutzer an der Spitze der scrollbaren Seite/Dokument:

$(document).scroll(function() { 
    if($(window).scrollTop() === 0) { 
    //do stuff 
    } 
}); 

Gibt es etwas, ähnlich in React Native, die mir helfen könnte festzustellen, ob der Benutzer am oberen Rand des Bildschirms ist oder nicht?

Answer 1

Mit einem ScrollView Sie etwas tun können:

_handleScroll(event) { 
    if(event.nativeEvent.contentOffset.y <= 0) { 
     console.log('top!'); 
    } 
} 
render() { 
    return (
     <View style={styles.container}> 
      <ScrollView 
       onScroll={this._handleScroll}  
       onScrollAnimationEnd={this._handleScroll} 
       style={{flex: 1}}> 
        <View style={[styles.child, {backgroundColor: 'red'}]} /> 
        <View style={[styles.child, {backgroundColor: 'orange'}]} /> 
        <View style={[styles.child, {backgroundColor: 'green'}]} /> 
      </ScrollView> 
     </View> 
    ); 
} 

var styles = StyleSheet.create({ 
    container: { 
     flex: 1, 
     backgroundColor: '#F5FCFF', 
    }, 
    child: { 
     flex: 1, 
     height: 400, 
    } 
}); 

Hoffe, es hilft!

Answer 2

Ja Scroll Komponente hat OnScroll Methode. pageX und pageY Eigenschaften evt nativeEvent contentOffset x y

handleScroll(event) { 
console.log(event.nativeEvent.contentOffset.y) 
}, 

<ScrollView onScroll={this.handleScroll}/>