0

I have an array of objects, one of the properties of each object is a JSX element that I want to render based on an index that I keep as a state in the parent component. I also need to pass props to these components, so I thought I could do something like <MyArray[index].myJsx foo="bar" /> But this seems not to be a valid syntax (due to the index part, I guess). How could I accoplish that? I don't think Array.map() fits my use case, since I want to show these components one at a time

Improve this question
4
  • 1
    did you try Reac.createElement ? Commented Jun 7, 2021 at 18:46
  • Tried const Context = MyArray[index].myJsx and then inside a return a <Context foo="bar" />? Commented Jun 7, 2021 at 18:53
  • Does this answer your question? Dynamically Rendering a React component Commented Jun 7, 2021 at 18:53
  • @LeoLima thanks, this does exactly what I need! The aswers linked by superhawk610 didn't fit my problem because the array caused problems with JSX syntax Commented Jun 7, 2021 at 19:05
Related questions
144
Rendering React Components from Array of Objects
1
How render react components from array
5
Render React components from array
Load 7 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.