reactjs - 如何获取元素 React 的位置 | Redux (.getBoundingClientRect() + .getWrappedInstance())

Question

我正在尝试查找使用 React 呈现的组件的位置。我正在使用redux，所以我不得不将connect函数修改为：

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

现在，当我调用时，我得到了一个组件：

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
    }
//...
}

所以我可以得到组件，但是我不能得到boundingClientRect。

有什么我忽略的吗？

请帮忙：）

Answer 1

我找到了绕过这个问题的替代解决方案：这篇文章描述并引用了另一篇文章

基本上，当组件开始渲染时，组件会提供一个回调函数，您可以在其中存储这些组件的位置。