从组件获取ES6类实例

Question

我有一个基类App（ES6语法）;我希望派生类能够指定几个要渲染的子组件 - 取决于它的状态。例如，

class App { 
    render() { 
    return ( 
     <div>{ this.state.c1 }</div> 
     <div>{ this.state.c2 }</div> 
    ); 
    } 
} 

class MyApp extends App { 
    constructor() { 
    this.state = { 
     c1: <Foo/>, 
     c2: <Bar/> 
    } 
    } 
} 

class Foo extends React.Component { 
    getTitle() { return 'Foo'; } 
} 

我还需要有基类应用程序，在子组件上调用方法。例如，this.state.component.getTitle()

但是，this.state.c1不是ES6类（即不是Foo的实例）。

我不能使用refs，因为基类不会创建<Foo/>组件。

我无法使用组合，因为App需要多个子组件。

有什么建议吗？

Answer 1

我认为最合适的方法是反转依赖关系。

即，将“Model”类作为属性“注入”每个组件。然后从基类访问属性。