react函数父组件访问插槽里的数据

在React中，插槽被称为props.children。要访问插槽中的数据，您可以使用React.Children.map()方法来遍历props.children并访问每个子元素的props。

例如，假设您的父组件包含以下插槽：

<MyParentComponent>
  <MyChildComponent name="Alice" />
  <MyChildComponent name="Bob" />
</MyParentComponent>

您可以在MyParentComponent中使用React.Children.map()方法来访问每个子元素的props，如下所示：

class MyParentComponent extends React.Component {
  render() {
    const { children } = this.props;
    return (
      <div>
        {React.Children.map(children, child => {
          console.log(child.props.name);
          return child;
        })}
      </div>
    );
  }
}

在这个例子中，React.Children.map()方法会遍历MyParentComponent的props.children并访问每个子元素的props。在这种情况下，它会输出“Alice”和“Bob”到控制台。

注意，React.Children.map()方法返回一个新的React元素数组，它可以被渲染或进一步处理。在上面的例子中，我们只是简单地返回每个子元素，但您可以根据需要对它们进行任何操作。