Props

  • Autor de la entrada:
  • Categoría de la entrada:React Native

La mayoría de los componentes se pueden personalizar cuando se crean, con diferentes parámetros. Estos parámetros creados se denominan props

App.js
import React, { Component } from ‘react’;
import { StyleSheet, Text, View } from ‘react-native’;
import AppLayout from ‘./src/appLayout’;

class HolaPropiedades extends Component{

constructor(props){
super(props);
this.state = {
user:’Doom’,
pass:’Universo’,
entrar: 1
}
}

render(){
return (

{
this.state.entrar == 0
?
Usuario no logeado
:
user={this.state.user}
pass={this.state.pass} />
}


)
}

}
const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: ‘#fff’, alignItems: ‘center’, justifyContent: ‘center’, }, }) export default HolaPropiedades

appLayout.js
import React from ‘react’
import { StyleSheet, Text, View } from ‘react-native’;

function AppLayout(props){
return (
<View style={styles.container}>
<Text>{props.saludo}! Usuario: {props.user} Password: {props.pass}</Text>
</View>
)
}

const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: ‘#fff’,
alignItems: ‘center’,
justifyContent: ‘center’,
},
})

export default AppLayout