React 如何获取 Children 的位置数据

Question

问题描述

正在自己从零封装类似 Antd 的 Popover 组件，为了确定浮窗位置，需要获取 props.children 的位置信息。所以有如上的问题：如何获取 Children 的位置信息。

期待实现的效果

与 Antd 一样，只需要 Popover 包裹 children 就可实现浮窗。

<Popover>
    <button>Hover me</button>
</Popover

相关代码

class Popover extends React.Component {
    render() {
        const { children } = this.props
        // 如何获取 children 的位置信息？
        // const childrenRect = ...
        return <React.Fragment>
            {children}
            {/** this.renderPopover(childrenRect) **/}
        </React.Fragment>
    }
}

Answer 1

css 先写好位置，然后传ClassName