Pass React Ref from parent to child in order to get DOM element
The best solution that doesn't involve any hack would be to pass a function from parent to child that return the ref of the element to be access
Parent:
constructor(props) {
super(props);
this.domElem = React.createRef();
}
getElem = () => {
return this.domElem;
}
render() {
return (
<div>
<div id="elem" ref={this.domElem}>Test Elem</div>
<Child getParentElem={this.getElem}/>
</div>
)
}
Child:
getParentRef = () => {
const elem = this.props.getParentElem();
}