How to concatenate two React components?

Question

I have the function sequinte, that does not work.

textao() {
 var texto =  <Text>Texto1</Text>;
 var texto2 = <Text>Texto2</Text>;
 return texto + texto2;
}

I want to concatenate two components. I know I could do it like this:

textao() {
 var texto =  <View><Text>Texto1</Text><Text>Texto2</Text></View>;
 return texto;
}

But I intend to make loops and recursive functions. Is there any way to concatenate two components? Or else some function like append which causes one component to insert another in?

I thought I’d do it like this:

concatena(c1, c2) {
  return <View>{c1}{c2}</View>
}

But I thought I pushed too hard.

Answer 1

From what I understand you do not want to concatenate components (which is not possible to do in React), you need to display one component after another dynamically, right?

Vc can place the components inside an array and then iterate under it.

const textao = () {
 var Texto = <Text>Texto1</Text>;
 var Texto2 = <Text>Texto2</Text>;
 return [Texto, Texto2];
}


const ComponentExample = () => (
  <View>
    {
      textao.map(value => (
        value
      ))
    }
  </View>
)