How to update existing state's any value on textInput?

Viewed 32

I have a page that includes 5 text inputs and I try to update this variable on a form.

Here my State:

  const addressDetails = {
    country: '',
    city: '',
    town: '',
    neighborhood:'',
    street:'',
    };
  const [address,setAddress] = useState(addressDetails);

I prepare my state like this before sending to form:

        setAddress({...address,
          country:"country1",
          city:"city1",
          town:"town1",
          neighborhood:"neighborhood1",
          street:"street1"
        });

In my text input it looks like this:

When I try to update with equal It doesn't update.

      <TextInput
      label="il"
      value={address.city}
      style={styles.textInputStyle} 
      onChangeText={(text) => address.city = text}
      />
          <TextInput
      label="ilçe"
      value={address.town}
      style={styles.textInputStyle} 
      onChangeText={(text) => address.town = text}
      />
          <TextInput
      label="Mahalle"
      value={address.neighborhood}
      style={styles.textInputStyle} 
      onChangeText={(text) => address.neighborhood = text}
      />
      <TextInput
      label="Sokak"
      value={address.street}
      style={styles.textInputStyle} 
      onChange={(text) => address.street = text}
      />

I also try with set:

        <TextInput
      label="Adres Başlığı"
      value={address_header.value}
      style={styles.textInputStyle} 
      onChangeText={(text) => setAdressHeader({value:text})}
      />
      <TextInput
      label="il"
      value={address.city}
      style={styles.textInputStyle} 
      onChangeText={(text) => setAddress({city:text})}
      />
          <TextInput
      label="ilçe"
      value={address.town}
      style={styles.textInputStyle} 
      onChangeText={(text) => setAddress({town:text})}
      />
          <TextInput
      label="Mahalle"
      value={address.neighborhood}
      style={styles.textInputStyle} 
      onChangeText={(text) => setAddress({neighborhood:text})}
      />
      <TextInput
      label="Sokak"
      value={address.street}
      style={styles.textInputStyle} 
      onChange={(text) => setAddress({street:text})}
      />

In this situation, it just creates a new one with one variable.

I just want to update what I change and keep others some.

Let's say when I update the "city1" to "city2" and "town1" to "town2" on textInput others set empty. But others are supposed to stay as "neighborhood1" "street1".

I am really new at React Native. Thank you for your answers.

0 Answers
Related