javascript - 理解 transferPropsTo

Question

我无法理解 transferPropsTo是为了读书the docs .

给出的示例如下所示:

var Avatar = React.createClass({
  render: function() {
    return this.transferPropsTo(
      <img src={"/avatars/" + this.props.userId + ".png"} userId={null} />
    );
  }
});

// <Avatar userId={17} width={200} height={200} />

我看不出这和:

return (
    <img src={"/avatars/" + this.props.userId + ".png"} />
)

还有什么我没有得到:

• userId={null} 是什么？应该说明什么？
• <Avatar />通过了 width=和 height= .做什么的？他们会怎样？

Answer 1

transferPropsTo 方法用于将属性从一个对象复制到另一个对象，文档试图准确解释哪些属性被复制。

what's the userId={null} supposed to illustrate?

显式设置不会被 transferPropsTo 覆盖，所以它表明即使 userId 是在 Avatar 上设置的，不会被复制，因为 userId 在 img 上明确设置为 null。

Avatar is passed a width= and height=. What for? What happens to them?

这是“转移”到 img 的两个属性，因此该示例大致等同于:

return (
    <img src={"/avatars/" + this.props.userId + ".png"} // explicit
         userId={null}                        // explicit, not overwritten
         width={this.props.width}             // copied
         height={this.props.height}           // copied
         />
)

这与原始示例之间的区别在于构造 Avatar 的代码控制在 img 上设置哪些附加属性，而不是 Avatar 的渲染方法本身。