任何想法，如果有一个干净的解决方案，这个“paradoxon”？儿童访问父组件

class Container extends Component { 
    render() { 
     <Parent> // ---------v 
      <Child parent={Parent} /> // Reference to "Parent" 
     </Parent> 
    } 
}

的问题是，当然，<Child>是<Parent>之前呈现。

最终目标是能够从<Child>内调用<Parent>的实例方法。

我已经尝试过解决方法，如(ref)，回调函数（getParentReference()），可以将其作为使用cloneElement()甚至this._reactInternalInstance新的道具通过基准，但没有人似乎（被极度哈克开）工作。

来源

2017-03-22 kraftwer1

您可以传递方法作为参数。例如'' – Abhishek

如果你真的想这样做，把必要的方法作为prop传递给孩子。 – dfsq

@Abhishek，@dfsq：方法是_within_' '... – kraftwer1

你应该考虑使用回调函数。

回调函数

的父母会传递一个函数给孩子做道具，像这样：

<MyChild myFunc={this.handleChildFunc.bind(this)} />

而且孩子会调用该函数，像这样：

this.props.myFunc();

不要忘记，孩子需要在propTypes中声明这个函数：

MyChild.propTypes = { 
    myFunc: React.PropTypes.func, 
};

欲了解更多信息，请阅读8 no-Flux strategies for React component communication

来源

2017-03-22 13:41:57 dschu

谢谢，但我想要传递的函数位于_within_''。没有_this.handleChildFunc（）_... – kraftwer1

只需在'Parent'组件中定义'handleChildFunc'，然后将它作为prop传递给'MyChild'组件，如示例中所示。好像你误解了这个概念。 :) – dschu

我已更新我的代码片段以更好地说明我的问题。请注意，我并没有试图从'Container'（你提供的例子中）添加一个道具，而是从我的''组件（它不是'''）'。 – kraftwer1

儿童访问父组件

回答

回调函数

相关问题