{"repo":"zhbhun/react-native-intersection-observer","free":true,"listed":false,"github":"https://github.com/zhbhun/react-native-intersection-observer","clone":"git clone https://github.com/zhbhun/react-native-intersection-observer.git","description":"React Native component that monitors when an element enters or leaves the client viewport.","language":"TypeScript","stars":133,"topics":["react","react-native","lazy-loading","lazyload","lazyload-images","intersection-observer"],"license":"MIT","category":"mobile-apps","readme_excerpt":"react-native-intersection-observer React Native implementation of the Intersection Observer API to tell you when an element enters or leaves the viewport. Installation Install using Yarn: or NPM: Usage You can pass any component to the , and it will handle creating the wrapping View component. Add a handler to the onChange method, and control the state in your own component. Any extra props you add to will be passed to the View component, allowing you to set the style , etc. You can also use the threshold prop to control how much of the element must be visible before it is considered in view. A value of 0 (default) triggers as soon as any part of the element is visible, while 1 requires the element to be fully visible within the viewport. Please note that the functionality of the InView component is dependent on the use of the withIO higher-order component to wrap your scrollable component. The react-native-intersection-observer library presently offers two frequently used scrollable components: IOScrollView and IOFlatList. It's imperative to utilize the InView component within one of these two components for it to work as intended. If neither IOScrollView nor IOFlatList suits your requirements, you have the flexibility to employ withIO to encapsulate your custom scrollable components. Furthermore, InView cannot be used within nested scrollable components. It solely monitors the immediate parent's scroll behavior, and scrolling at higher ancestral levels does not trigger InVi","default_branch":null,"files":null,"tree":[],"storefront":"/r/zhbhun","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/zhbhun/react-native-intersection-observer/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}