reactjs 如何手动刷新所有子组件

在React中，可以通过给父组件传递一个状态值，并在父组件中更新该状态值来实现手动刷新所有子组件。

以下是一个示例代码：

import React, { useState } from 'react';

function ParentComponent() {
  const [refresh, setRefresh] = useState(false);

  const handleRefresh = () => {
    setRefresh(!refresh);
  };

  return (
    <div>
      <button onClick={handleRefresh}>刷新子组件</button>
      <ChildComponent refresh={refresh} />
      <ChildComponent refresh={refresh} />
      <ChildComponent refresh={refresh} />
    </div>
  );
}

function ChildComponent({ refresh }) {
  return (
    <div>
      {refresh ? <p>已刷新</p> : <p>未刷新</p>}
    </div>
  );
}

export default ParentComponent;

在上述代码中，父组件ParentComponent中有一个refresh状态值，当点击按钮时，会触发handleRefresh函数，通过更新refresh状态值来实现刷新。同时，ParentComponent将refresh状态值作为props传递给三个子组件ChildComponent，子组件根据refresh的值来展示不同的内容。

当点击按钮时，父组件中的refresh状态值会更新，然后子组件的props也会更新，从而触发子组件的重新渲染，实现了手动刷新所有子组件的效果