I've tried implementing a global react-tooltip. I was assuming that any jsx element with data-tip and using the global react-tooltip id in data-for will magically work anywhere, regardless if it's inside a child component.
Maybe my implementation is wrong, or maybe my assumption is wrong. Please let me know why my code below doesn't work. Thank you.
<ParentComponent>
<ChildComponent>
<a data-tip="test 1" data-for="global-tooltip">Link 1</a>
<a data-tip="test 2" data-for="global-tooltip">Link 2</a>
<a data-tip="test 3" data-for="global-tooltip">Link 3</a>
</ChildComponent>
<ReactTooltip id="global-tooltip" place="top" type="light" effect="solid" />
</ParentComponent>