Как получить реальный Dom-узел с React.useRef? Element.getBoundingClientRect () не работает с переменной useRef

Question

Я пытаюсь использовать Element.getBoundingClientRect (), чтобы получить значение x, y, top, left для элемента dom.

const editorRef = useRef() 
... // attatched editor ref on the dom element that I'm interested
... 
editorRef.current.focus() // works well 
const editorNodeRect = editorRef.current.getBoundingClientRect() // got error saying getBoundingClientRect() is not a function 

, поэтому я попробовал этот способ, выбрав узел по запросу

const editorNodebyQuery =document.querySelectorAll(".DraftEditor-root")[0];
const editorNodebyQueryRect = editorNodebyQuery.getBoundingClientRect() // work well!! 

но мне не нравится обращаться к dom-узлу по запросу ... Я думаю, что это тяжело ... Я хочу использовать useRef.

первый rootEditorNode - это то, что я получил с помощью querySelector, и он имеет функцию getBoundingClientRect (), второй editorRef.current - это то, что я получил с помощью useRef, и у него нет функции getBoundingClientRect ().

Я просто хочу знать, как использовать функцию getBoundingClientRect () с useRef ()