1.0.9 • Published 2 years ago
@metislib/core v1.0.9
Features
- Organization metislib's library
Install
pnpm install @metislib/core
Component
InvisibleIntersectionTarget: this component can help easy to use IntersectionObserver API.
const handleIntersect: OnIntersectFunction = async (entry, observer) => { observer.unobserve(entry.target); console.dir("observed"); }; return ( <div className="App"> <h1>TEST</h1> <div style={{ height: "2000px" }}></div> <InvisibleIntersectionTarget onIntersect={handleIntersect} /> </div> );
InfiniteScrollSection.tsx: If observed end of this div component, handles onScrollEnd props function.
onst handleIntersect: OnIntersectFunction = async (entry, observer) => { observer.unobserve(entry.target); console.dir("observed"); }; return ( <div className="App"> <h1>TEST</h1> <InfiniteScrollSection onScrollEnd={handleIntersect} > <div style={{ height: "2000px" }}></div> </div> );