使用 ref 不起作用 - counterElement.getElementById 不是函数

Question

我试图通过 ref 获取我的计数器 div，但它给了我一个错误“counterElement.getElementById 不是函数”

export default function CountersCube() {
    const counterWrapper = useRef(null)
    
    useEffect(() => {
        const [counterElement] = counterWrapper.current.children
        const counter = counterElement.getElementById("counter");
        console.log(counter)
    })



  return (
    <div className="countersCubeContainer">
        <div ref={counterWrapper}>
                <div id="counter" data-target="60000">0</div>
        </div>
    </div>
  )
}

Answer 1

getElementById是document对象的属性，而不是每个元素的属性。

使用element.querySelector('#id')代替。

也就是说，具有该 id 的元素是counterElement的子元素，因此您不会通过搜索它的后代来找到它。

直接使用counterElement即可。 更好的是，将 ref 放在计数器元素上而不是它的包装器上。