访问React组件的所有子组件

Question

我有react组件A，它呈现一个表。表中某一列的数据通过另一个组件B呈现，因此是的子级。每当用户单击页面上的任何位置时，我希望在上执行一些操作。此click事件侦听器是在A中定义的。如何从类A内循环所有s？我的组件结构如下所示：

class A extends React.Component {
   <B/>
   <B/>
   <B/>
   <B/>
};

我遇到了react.children.foreach，但当通过this.props.children将子级作为道具传递时，这很有用；例如，当代码如下所示时：

<A>some markup</A>

Answer 1

const childrenProps = React.Children.map(this.props.children,
 (child) => React.cloneElement(child, {
    data : this.state,
    method : this.method.bind(this)
   // here you can pass state or method of parent component to child components
 }));

  // to access you can use this.props.data or this.props.method in child component

您需要传递包含所有子组件的{childrenProps}。