Home > database >  React-native pass Json values to react native <input
React-native pass Json values to react native <input

Time:12-05

Hello friends,

I am just starting with react-native to create one app for android cel. I have a form with 2 fields / and I want to load those fields from json that I pull from php file. If I send only one value through json I can load that value in one field using "componentDidMount" and "XMLHttpRequest()" This is the code I am using at componentdidmount:

componentDidMount=()=> {
  let _this= this;
  const xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200){
      console.log(this.responseText);
      var temp = JSON.parse(xhttp.responseText);
      console.log(temp);
      _this.setState({datos: temp});
    }
  };
  xhttp.open('GET', 'https://smppage.000webhostapp.com/gest_ObtFolio2.php', true);
  xhttp.send();
} 

These are the values printed in the console.log: responsetext: LOG [{"iddeOS":"13"},{"fecha":"2021-12-04"}] temp: LOG [{"iddeOS": "13"}, {"fecha": "2021-12-04"}]

When I only send one field through json I can load it in one field but I want to send 2 fields over json, this is the value that I send over json for only one field: responsetext: LOG "14" temp: LOG 14 This is the code that I use in one / when I pull only one field and and that field is correctly loaded at my

            <View style={{flex:1}}>
              <Input
                ref={component => this.folioOrden = component}
                label=" Folio"
                value={this.state.datos.toString()}

With this code it correctly loads the value in one field

can you help to find the code to fill the 2 fields "Folio" and "Fecha"at the same time with component did mount?

            <View style={{flex:1}}>
              <Input
                ref={component => this.folioOrden = component}
                label=" Folio"
                value={this.state.datos.toString()}
            <View style={{flex:2}}>
              <Input
                ref={component => this.fechaAperOrden = component}
                label=" Fecha"

I already tried sendinf the 2 fields and using this code in both inputs but I shows errors:

value={this.state.datos.iddeOS.toString()}
value={this.state.datos.fecha.toString()}

Thanks in advance

CodePudding user response:

You should use destructuring with your response:

this.setState({...temp});

If the content of temp is:

{iddeOS:'SomeValue',fecha:'2021-12-04'}

it will replace the state to:

this.state.iddeOS
this.state.fecha
  • Related