Question

当第二个组件使用React.render时，如何将当前组件的上下文传递给新组件？

我有一个组件A，它是App的子项，呈现在文档中。

我无法使用常规嵌套呈现过程将组件B呈现到组件A中。组件A是第三方React组件，我需要修改其DOM结构。

我正在使用jQuery将空div添加到组件A中，然后将组件B渲染到空div中，即：

React.render(componentB, jqueryDOMNode);

这样可以正常工作，除了组件B然后在React路由器外部呈现，它包裹App。然后问题变成React Router需要context.router，但是组件B在其上下文中没有收到路由器，即。

  contextTypes: {
    router: React.PropTypes.func.isRequired
  },

在组件B中不起作用。

我尝试通过道具将组件A的上下文传递给组件B，并使用包含childContextTypes和getChildContext的包装器组件无效：

var ComponentBWrapper = React.createFactory(React.createClass({    
  childContextTypes: {
    router: React.PropTypes.func.isRequired
  },

  getChildContext: function() {
    return {router: this.props.context.router};
  },

  render: function() {
    return ComponentB(_.omit(this.props, 'context'));
  }
}));

思想？

反映渲染上下文/ context.router

0 个答案: