Question

即使模式名为 render props ，你也不必使用名为 render 的属性名来使用此模式。也就是说，组件用于知道即将渲染内容的任何函数属性，在技术上都是一个 render props 。让我们举一个名为 children 渲染属性的示例：

<Mouse children={mouse => (
  <p>The mouse position is {mouse.x}, {mouse.y}</p>
)}/>

实际上，以上的 children 属性不一定需要在 JSX 元素的 attributes 列表中命名。反之，你可以将它直接放在元素内部：

<Mouse>
  {mouse => (
    <p>The mouse position is {mouse.x}, {mouse.y}</p>
  )}
</Mouse>

当使用上述的技术，需要在 propTypes 中明确声明 children 必须为函数类型：

Mouse.propTypes = {
  children: PropTypes.func.isRequired
};