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的父親，它的子節點可以是任何組件。