React.js中所有者和父组件之间的区别是什么

Question

React 0.13带来基于父的上下文而不是基于所有者的上下文 。

所以，我不太明白所有者和父组件之间的区别。 将举例说明。

Answer 1

var A = React.createClass({
    render() {
        return (
            <B>
                <C />
            </B>
        );
    }
});

在上面的示例中，A是B和C的所有者 ，因为A创建了两个组件。

但是，B是C的父级 ，因为C作为子传递给B.

可以在文档中找到更多信息。

区分所有者 - 所有者关系和父子关系是很重要的。 owner-ownee关系特定于React，而父子关系只是您熟悉并喜欢DOM的关系。

Answer 2

从官方文档：

An owner is the component that sets the props of other components

这里有一个例子，其中A是B的所有者：

var A = React.createClass({
  render: function() {
    return <B />;
  }
});

A是B的所有者，因为B是在A的render功能中创建的。

这是A是B的父级的示例：

var A = React.createClass({
  render: function() {
    return <div>{this.props.children}</div>;
  }
});

var B = React.createClass({
  render: function() {
    return <span>B</span>;
  }
});

React.render(
  <A><B /></A>,
  document.getElementById('example')
);

在这个例子中，A是B的父亲，因为A的props.children包含B.但是A没有直接知道它的B的父亲，它的子节点可以是任何组件。