从父级 React 刷新子级状态

我有一个包含一些数据的表，表中的每个元素都是一个 React 类组件。它看起来像这样：

我想要的只是有一个用于“检查所有”功能的复选框（左上角复选框）。问题是我不知道如何解决这个问题，因为props and state.

我在单元素组件中有类似的代码：

getInitialState: function() {
    return { component: this.props.data };
  },

render: function() {
    var data = this.state.component;
    data = data.set('checked', this.props.data.get('checked'));
    ...
}

我知道我不应该得到checked参数来自props但这只是暂时的。

我遇到的问题是：当我更新时checked父级中的参数它不会更新状态，因为getInitialState刷新后不会被调用（是的，我知道它应该是这样的）。

我的问题是：我可以以某种方式更新子组件的状态吗？或者这是实现这一目标的更好方法。

具有功能组件：当父级提供的 props 发生变化时，刷新子级内部状态的一种简单方法是通过useEffect():

在儿童中：

const [data, setData] = useState(props.data);

useEffect( () => {
    setData(props.data);
}, [props.data]); 

这样每次props.data更改 useEffect 将被触发并强制为某些数据设置新状态，因此组件将“刷新”。