javascript - 从父级访问 React 组件子级 props

Question

我目前正在设计一个用 JavaScript 和 ReactJS 编写的游戏引擎的界面。

如果游戏对象有纹理，纹理的来源将显示在游戏对象上。为此，游戏对象需要具有纹理的引用，或更具体地说是纹理的源。我希望有一个像下面这样的 JSX 代码片段。

<GameObject>
  <Texture source="myimage.png" />
</GameObject>

我能想到的获取引用的最佳解决方案是将纹理作为 Prop ，如下所示:

<GameObject texture={<Texture source="myimage.png" />} />

如果游戏引擎特定的术语有点令人困惑，请将其视为按钮组件内的标题组件，其中标题组件具有按钮需要访问的特定数据。

我的问题归结为:在没有黑客或反模式的情况下安装子项后是否可以访问子项的 Prop ？

Answer 1

由于评论中的链接已损坏，我附上link到当前的 react-router Switch 模块实现，其中子级被解析(请参阅 render() 函数)。也在 this tutorial video作者从父级访问子级 props。

为了避免再次遇到链接过期的相同问题，以下是受 react-router 的 启发，从父级访问子级 props 的代码在上面的示例中的样子开关:

(游戏对象内)

const { children } = this.props

React.Children.forEach(children, element => {
  if (!React.isValidElement(element)) return

  const { source } = element.props

  //do something with source..
})