小编use*_*126的帖子

我明白，在你的 React 组件中，呈现一个组件而不是使用呈现一些 JSX 的函数总是好的。我的意思是，

这样做：

export default function App() {
  const [count, setCount] = useState(0);
  const someRenderFunction = () => <p>Hey</p>;
  return (
    <div className="App">
      {someRenderFunction()}
      <button
        onClick={() => {
          setCount((c) => c + 1);
        }}
      >
        Increment{" "}
      </button>
      <p>{count}</p>
    </div>
  );
}

不鼓励。渲染函数应该导出到它自己的组件中，如下所示：

const HeyComponent = () => <p>Hey</p>

export default function App() {
  const [count, setCount] = useState(0);
  return (
    <div className="App">
      <HeyComponent />
      <button
        onClick={() => {
          setCount((c) => c + 1);
        }}
      >
        Increment{" …