scroll-sync-react
scroll-sync-react copied to clipboard
Render props
This is related to #15 and is more of a proof of concept than anything else. Using a render slot may not be the best way to do this, but it's a good place to start. I would prefer to use a fowardRef
and pass that directly to the scroll component like so:
const MyCustomComponent = React.forwardRef(( _props, ref ) => {
return (
<div id="outer">
<div id="inner" ref={ref}></div>
</div>
)
})
<ScrollSyncNode component={MyCustomComponent} />
However, I am working on an example for the above, until then we have this.
Having the render
prop allows the developer to decide which element we want to store a ref for, I have included an example so you can can clone or add my fork remote to your existing project and see what you think.
I am aware this breaks some existing functionality and the typings are poor, I didn't spend to much time on it.