TransWikia.com

Obtener valor de un componente TextInput en react native

Stack Overflow en español Asked on November 7, 2021

Genere dinamicamente unos TextInput cuando se presiona un boton pero no puedo obtener el valor que el usuario digita,intente usar estados pero no lo logro ya que no esta con los otros textInputs generales si no que se importa como Campo.

intente crear un estado en el archivo del componente y pasarlo a la vista general e imprimirlo para ver si funciona y no…hay alguna forma de traer este estado?

vista general:

import Campo from './campoInput';
  
constructor(props){
super(props);

this.state={
  Cbusto:"",
  Ccintura:"",
  Ccadera:"",
  valueArray: []
};
this.addNewEle = false;

}

  agregarCampo=()=>{
  this.addNewEle = true;
  const newlyAddedValue = { text: 'prueba'};

  this.setState({
  
    valueArray: [...this.state.valueArray, newlyAddedValue]
  });
}
render(){
return(

------aca estan los otrox textInput normales-----

     <View style={{ flex: 1, padding: 4 }}>
        {this.state.valueArray.map((ele) => {
          return <Campo item={ele} />;
        })}
      </View>

      <View style={styles.flex}>
        <View style={styles.ButtonAdd}>
          <Button
            title="Add input"
            color="#B13682"
            onPress={this.agregarCampo}
          ></Button>
        </View>

)
}

componente:

   constructor(props){
    super(props);
    
     this.state={
    info:""
    }; 
    }

render(){
    return(
        <View>
            <Text>pruba:{this.props.item.text}</Text>
            <View style={styles.input}>
            <TextInput onChangeText={(text) => this.setState({info:text})}></TextInput>
            </View>
        </View>
    )
}
 

One Answer

se logro solucionar agregando el evento onChangeText a el componente Campo en la vista general y de la misma forma en el TextInput del componente que se importa, mediante estado props:

Vista general:

<View style={{ flex: 1, padding: 4 }}>
        {this.state.valueArray.map((ele) => {
          return <Campo item={ele}
          onChangeText={(text) => this.setState({ info: text })}
          />;
        })}
</View>

Componente:

 <View>
         <Text>pruba:{this.props.item.text}</Text>
         <View style={styles.input}>
         <TextInput onChangeText={this.props.onChangeText}></TextInput>
         </View>
 </View>

Answered by fabrixo96 on November 7, 2021

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP