React-Draggable中findDOMNode已废弃且ref冲突的问题咨询

各位React大佬们，我最近在开发一个带拖拽功能的组件时遇到了棘手的问题，想请教下大家的解决方案：

我做了一个函数式组件，里面的元素可以在指定区域内自由拖拽，拖拽后的位置会被保存下来——下次页面加载时，不管浏览器窗口尺寸怎么变，这些元素都要精准定位到上次拖拽后的位置。

为了实现这个适配和定位逻辑，我需要在元素刚挂载到DOM的时候就获取它们的宽高，这样才能计算出正确的位置。目前我的核心代码大概是这样的：

list.map((item) => (
  <Draggable
    key={item.ID}
    grid={[1, 1]}
    bounds="parent"
    id={item.ID}
    position={{ x: item.positionX, y: item.positionY }}
    onDrag={(e, ui) => {
      const newX = item.positionX + ui.deltaX;
      const newY = item.positionY + ui.deltaY;
      updatePosition(item.ID, newX, newY);
    }}
  >
    <div 
      style={{ position: "absolute", display: "flex" }}
      ref={element => { handleInitObjDOM(element, item.ID) }}
    > 
      {/* 计划在这里获取元素的宽高 */}
    </div>
  </Draggable>
))

但现在碰到了两个麻烦：

• 之前我尝试用findDOMNode来获取Draggable包裹的内部元素，但这个API已经被React废弃了，肯定不能再用了，不知道有什么合适的替代方案；
• 直接给内部的div加ref的话，好像和Draggable组件自身的ref产生了冲突，要么拿不到正确的DOM元素，要么控制台会抛出警告。

有没有大佬能教教我，怎么在不依赖findDOMNode的情况下，正确获取到Draggable内部元素的DOM节点，并且在组件初始化时顺利拿到它的宽高来完成定位适配呢？

备注：内容来源于stack exchange，提问作者Alexander Babenko