Definir adereços do componente dinamicamente

Eu preciso definir adereços do componente depois que ele é armazenado em uma variável, aqui está o pseudo-código:

render(){

    let items = [{title:'hello'}, {title:'world'}];
    let component = false;

    switch (id) {
      case 1:
        component = <A />
        break;
      case 2:
        component = <B />
        break;      
    }

    return(
      items.map((item, index)=>{
        return(
          <span>
            {/* SOMETHING LIKE THIS WOULD BE COOL - IS THAT EVEN POSSIBLE*/}
            {component.props.set('title', item.title)}
          </span>11

        )
      })
    )
  }

Dentroreturn Eu corro um loop em que preciso definir adereços para o componente que é armazenado dentro de uma variável .... Como definir adereços para esse componente que eu armazenei anteriormente em uma variável?

questionAnswers(3)

yourAnswerToTheQuestion