xxxxxxxxxx
We just cannot use map() function with Object.
We can use forEach instead, through the usage is bit different.
xxxxxxxxxx
The "TypeError: map is not a function" occurs when we call the map() method on a value that is not an array. To solve the error, console.log the value you're calling the map() method on and make sure to only call map on valid arrays.
Here is an example of how the error occurs.
App.js
const App = () => {
const obj = {};
// ⛔️ Uncaught TypeError: map is not a function
return (
<div>
{obj.map(element => {
return <h2>{element}</h2>;
})}
</div>
);
};
export default App;
xxxxxxxxxx
To solve the error, console.log the value you're calling the map method on and make sure it's a valid array.
App.js
export default function App() {
const arr = ['one', 'two', 'three'];
return (
<div>
{arr.map((element, index) => {
return (
<div key={index}>
<h2>{element}</h2>
</div>
);
})}
</div>
);
}