Extract string from object and pass it to parent function - Typescript , React

Question

I am trying to achieve something rather simple, but i do not know why i am so stuck on it. I want to send data to an parent function. This data is only acceptable in a form of a string. But my issue here is that sometimes on click event i may have multiple strings The final goals is to send them both up

setNewFruits('banana' , 'mango')

So on click i am getting my object

...
  const foundFruits = foundFruitsCategory.fruits

console.log : {name: 'banana', id: 1, color: 'yellow'}

And the if i want to extract the name only i do :

 const foundAndSelectedFruit = foundFruits.map((fruit) => fruit.name)

console.log output:

['banana']

But the thing is i want to have the name only as a string banana and not as array of strings. Yes i can say

console.log(foundAndSelectedFruit[0])

That will give me the banana , but the thing is sometimes onClick i could have two objects

console.log output:

[
  {name: 'banana', id: 1, color: 'yellow'}
  {name: 'mango', id: 2, color: 'orange'}
]

So the log of foundAndSelectedFruit will be

['banana','mango']

How i can extract them as seperate strings and send them to my update function ? ( The function awaits a string of name )

P.S. I already tried with forEach loop , but instead of printing my string it gives me back undefined

Ángel · Accepted Answer · 2022-03-18 17:42:48Z

2

Have you tried the spread operator?

setNewFruits(...foundAndSelectedFruit)

answered Mar 18, 2022 at 17:42

Ángel

991 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

PandaMastr Over a year ago

Yes , the spread operator will return me a string like this setNewFruits( banana mango ) . So it is not the answer that i am searching for. I need to send to seperated string to the parent

Ángel Over a year ago

If foundAndSelectedFruit = ['banana','mango'] as I understood. Then the spread operator will do this setNewFruits('banana', 'mango'). If you wanted it to be sent individually then you could foundAndSelectedFruit.forEach(fruit => setNewFruits(fruit))

Collectives™ on Stack Overflow

Extract string from object and pass it to parent function - Typescript , React

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related