为什么使用状态设置器回调作为ref回调不会导致重新呈现

Question

import "./styles.css";
import React from "react";
export default function App() {
const [element, setElement] = React.useState(null);
const [count, setCounter] = React.useState(0);
console.log(element);
const handleClick = (e) => {
setCounter(count + 1);
};
return (
<div className="App">
<h1
ref={setElement}
>
Hello CodeSandbox
</h1>
</div>
);
}

ref={setElement}

应该引起一个无限循环，但是，它只打印一次元素。为什么会发生这种情况？沙箱

Answer 1

这是因为ref初始化只在第一次渲染时发生！