Как вложить в параметры компонента, другой компонент, так чтобы можно было ему передать свойства?

Question

[RomanSS]

Подскажите как сделать обертку для компонента, чтобы он грузил выбранный компонент в нём?
Примерный набросок кода ниже или здесь codepen.io/anon/pen/BpJxgd

Есть корневой компонент <TestContent /> и для него есть два компонента <Test1 /> и <Test2 />

В TestContent выполняется определенный код, который меняет данные для вывода. Эти данные нужно загрузить либо в Test1 или в Test2.
Вопросы:
1) как мне в TestContent передать данные какой компонент грузить Test1 или Test2
2) Как скорректированные данные передать выбранному компоненту?

const { Component } = React

class App extends Component {
  constructor(props) {
    super(props)
  }

  render() {
    return(
      <div>
       <TestContent нужноПередатьКомпонентTest1&Test2 />
      </div>
    )
  }
}

class TestContent extends Component {
  render() {
     var data={name:"какие-то данные для вывода в выбранном компоненте"};
    return(
      <div>
        !!!! Как сюда загрузить компонет <Test1 data={data}> или <Test2 data={data}>, так чтобы в них присутствовали данные и переменной data?
      </div>
    )
  }
}

class Test1 extends Component {
  render() {
    return(
      <div>Test 1 — {this.props.data.name}</div>
    )
  }
}

class Test2 extends Component {
  render() {
    return(
      <div>Test 2 {this.props.data.name}</div>
    )
  }
}

ReactDOM.render(<App />, document.getElementById('app'));

Answer 1

[Aves]

Можно просто передать в props сам компонент.

<TestContent name={Test2} />
...
class TestContent extends Component {
  render() {
     var data={name:"какие-то данные для вывода в выбранном компоненте"};
     var Name = this.props.name;
    return(
      <div>
        <Name data={data} />
      </div>
    )
  }
}

codepen.io/anon/pen/vgpawM?editors=0010

Comments

[RomanSS]

Спасибо!

Answer 2

[Андрей Антропов]

Сейчас уже появились интересные реализации, например вот такой проект https://www.npmjs.com/package/react-async-component

Comments

[RomanSS]

спасибо, может в дальнейшем пригодиться.