在哪里可以找到有关在React中将道具传递给孩子的用法的API指南？

Question

全部：

我对React-motion非常陌生，当我读到它的源代码(Motion.js)时，有一个地方是这样的：

  render: function render() {
    var renderedChildren = this.props.children(this.state.currentStyle);
    return renderedChildren && _react2['default'].Children.only(renderedChildren);
  }

我对这一行感到困惑：

var renderedChildren = this.props.children(this.state.currentStyle);

我想知道这行是做什么的，它只是给孩子们提供了这些风格吗？如果是这样的话，我可以在React网站的哪里找到这种用法的文档？

我还找到了一个通过道具的解决方案：

How to pass props to {this.props.children}

R他们以不同的方式做同样的事情？

谢谢

Answer 1

这是因为在这种特殊情况下，唯一传递的子级是一个函数。例如，您可以看到TransitionMotion组件accepts a single child which is a function，例如：

<TransitionMotion willLeave={this.willLeave} styles={styles}>
  {circles =>
    <div
      onMouseMove={this.handleMouseMove}
      onTouchMove={this.handleTouchMove}
      className="demo7">
      {circles.map(({key, style: {opacity, scale, x, y}}) =>
        <div
          key={key}
          className="demo7-ball"
          style={{
            opacity: opacity,
            scale: scale,
            transform: `translate3d(${x}px, ${y}px, 0) scale(${scale})`,
            WebkitTransform: `translate3d(${x}px, ${y}px, 0) scale(${scale})`,
          }} />
      )}
    </div>
  }
</TransitionMotion>

在它的propTypes中，children has to be a function。

但在官方文档中(通常是这样)，children是React.createElement的实例，在JSX中由类似DOM的语法表示，并从a plain-object中反映出来，因为React.createElement返回一个纯对象。

使用react-motion的情况非常少见和先进，尽管您可能希望在某个时候使用此方法，如果您发现它比简单地以经典方式传递子组件更合适。