how can I pass a value on reactjs within the map?

March 7, 2022

ola, will it be that has some way to pass AxiosComponent inside the map without it returns this error ?

My code:

musicTop.map((item, key)=>{
      <AxiosComponent titles={item.title} key={key} items={item.items} />
})

my error:

Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object.

>Solution :

The arrow function you’re providing to map doesn’t return anything.

Try one of these instead (they are both the same, just with slightly different syntax):

musicTop.map((item, key) => {
  // Here we add the `return` keyword that was missing in the original code
  return <AxiosComponent titles={item.title} key={key} items={item.items} />
})

// Here we use a shorthand form of the arrow function to return the component
musicTop.map((item, key) => <AxiosComponent titles={item.title} key={key} items={item.items} />)