Feature- Request: Add `onStickyChange` to `<Sticky/>`
Opened this issue · 1 comments
I'm submitting a ...
- bug report
- feature request
- support request
What is the current behavior?
If I want to lift the isSticky
state of a certain <Sticky/>
to the parent component, I can't do it.
(setting an ancestor's state within the <Sticky/>
's "children as a function" call yields a React warning (render should not have side-effects)
What is the expected or desired behavior?
Why do you want this? What use case do you have?
My use-case is that when the <Sticky/>
gets sticky, I want to render it in some other container (not with position: fixed
.
Another use-case could be, styling the <StickyContainer/>
(Or another ancestor of the <Sticky/>
) differently when the content isSticky=true
.
Is there anything else I should know?
I like this lib.
I agree this might be useful functionality to add to StickyContainer
. To implement something like it for now, you can have render a component like
class App extends React.Component {
render() {
return (
<StickyContainer>
<Sticky>
{stickyProps => (
<CustomStickyElement
onStickyChange={handleStickyChange}
stickyProps={stickyProps}
/>
)}
</Sticky>
</StickyContainer>
);
}
}
where CustomStickyElement
checks for changes to isSticky
and calls the handler accordingly.