CODEWITHSUNDEEP
javascriptreact-native
Richlewis
Richlewis

Reputation: 15384

Update multiple states via onValueChange - React Native

I have dropdown from which a user will select a value from, each of these values have a corresponding description. To populate the dropdown i retrieve the values from my database

Once a user has selected their value, I would like to update another field (so a separate state) with that corresponding description

This is how i populate the dropdown so far

 const [newEventName, setEventName] = useState('');
 const [newEventDescription, setEventDescription] = useState('');

<Select
  onValueChange={newEventName => setEventName(newEventName)}
  placeholder="Select Event"
>
{eventTypeData.map(event => (
  <Select.Item
    key={event.id}
    label={event.name}
    value={event.name}
   />
 ))}
 </Select>

Can I call two methods within my onValueChange, so i would create a custom function to handle mapping the value selected to its appropriate description, then call it within the onValueChange

Unless theres a better way?

Upvotes: 0

Views: 48

Answers (2)

Akshay Shenoy
Akshay Shenoy

Reputation: 1248

This is pretty straightforward, create a function and write the logic to extract description from your eventName, and then set both values.

const setEventNameAndDesc = (newEventName) => {
// extract your description from the eventName
   setEventName(newEventName);
   setEventDescription(newEventDescription);
}                    
onValueChange={newEventName => setEventNameAndDesc(newEventName)}

Upvotes: 0

Jaid
Jaid

Reputation: 181

You can just do like bellow

const updateValues = (newEventName) => {
                         // find your newEventDescription
                         setEventName(newEventName);
                         setEventDescription(newEventDescription);
                     }
onValueChange={newEventName => updateValues(newEventName)}

Upvotes: 1

Related Questions