Soy nuevo en React Native y no sé como puedo renderizar un componente varias veces, digamos que tengo un componente que es una caja, yo quiero que me renderize ese componente 9 veces por ejemplo.
Este es el componente que me da una caja, le he quitado los styles para no liar más.
class Box extends Component<Props> {
render() {
return (
<View>
<View>
<Text></Text>
</View>
<View>
<Text></Text>
</View>
<View>
<Text></Text>
</View>
</View>
)
}
}
Y llamo al componente anterior desde este otro componente:
class Prov extends Component<MyProps, MyState> {
constructor(props: any) {
super(props);
this.state = {
componentController: true}
}
changeStateTrue() {
this.setState({componentController: true});
}
changeStateFalse() {
this.setState({componentController: false});
}
render() {
let renderComponent;
const componentController = this.state.componentController;
if (componentController) {
renderComponent=<Box/>
}
return (
<View>
<View>
<TouchableOpacity onPress={() => this.changeStateTrue()}>
<Text> Por Aceptar </Text>
</TouchableOpacity>
<TouchableOpacity onPress={() => this.changeStateFalse()}>
<Text> En curso </Text>
</TouchableOpacity>
</View>
<View>
{renderComponent}
</View>
</View>
)
}
}