@coffeebeanslabs/反应-本土-inviewport

检测组件是否在设备视图中 . 我以https://github.com/yamill/react-native-inviewport为根据.

安装

npm i @coffeebeanslabs/react-native-inviewport

使用量

import InViewPort from "@coffeebeanslabs/react-native-inviewport";
checkVisible = isVisible => this.setState({visible: isVisible});

render() {
  return (
  <ScrollView style={{flex: 1}}>
    <InViewPort onChange={(isVisible) => this.checkVisible(isVisible)}>
      <View style={{flex: 1, height: 200, backgroundColor: 'blue'}}>
        <Text style={{color: 'white'}}>View is visible? {this.state.visible}</Text>
      </View>
    </InViewPort>
  </ScrollView>
  );
}