I wanted to give this library the name react-visible
, but it is taken for an useless component. So back to the main! This component detects if the inner children are visible or not. With onDisappear: (visible: boolean) => void;
can you get the current visible state
# With NPM
npm add react-disappear
# With Yarn
yarn add react-disappear
# With bun
bun add react-disappear
# In some cases you'll need tslib, do this by:
npm add --save-dev tslib
Class Component requires an wrapper
import { Disappear } from "react-disappear";
function App() {
return (
<div>
<Disappear
as={"div"} // or custom components
onDisappear={(state, ref) => {
console.log(state);
}}
style={{ backgroundColor: "#fff" }}>
<span>Content</span>
<span>Content</span>
<span>Content</span>
<span>Content</span>
<span>Content</span>
</Disappear>
</div>
);
}
rct.renderAuto(App);