How to get position of element React | Redux (.getBoundingClientRect() + .getWrappedInstance())

Question

I am trying to find a position of a component rendered with React. I am using redux, so I had to modify the connect function to:

export default connect(mapStateToProps, mapDispatchToProps,null,{ withRef: true })(MyComponent);

Now I am getting a component back when I call:

class OneColumn extends Component { 
    componentDidMount(){

        var input = this.refs.myComponentsRef.getWrappedInstance();

        console.log(input); // Outputs > TheComponentIWant {props: Object, context: Object, refs: Object, updater: Object, _reactInternalInstance: ReactCompositeComponentWrapper…}

        var inputRect = input.getBoundingClientRect(); 
        console.log(inputRect); // Outputs error: Uncaught TypeError: input.getBoundingClientRect is not a function
    }
//...
}

So I can get the component, however I cannot then get the boundingClientRect.

Anything I am overlooking?

Please help:)

Answer 1

I found an alternate solution that circumvents this problem: This post describes and refers to another post

Basically when the components starts rendering the components give a callback function where you store the positions of those components.