Quantcast
Channel: Recent Questions - Stack Overflow
Viewing all articles
Browse latest Browse all 11601

TypeError: products.map is not a function. map function is not recognised

$
0
0

I want to render the list "products".Means there are 3 items in product array, I want to use map method to render this list. But getting TypeError: products.map is not a function

const products = [  {    id: 101,    name: "Skirt",    image: "https://i.pravatar.cc/48?u=118836",    price: 700,  },  {    id: 102,    name: "Jeans",    image: "https://i.pravatar.cc/48?u=933372",    price: 1500,  },  {    id: 103,    name: "Top",    image: "https://i.pravatar.cc/48?u=499476",    price: 1000,  },];function App() {  return (<div className="App"><RetriveProducts products={products} /></div>  );}function RetriveProducts(products) {  return (<div>      {products.map((product) => {<ProductList          image={product.image}          name={product.name}          price={product.price}        />;      })}</div>  );}function ProductList(image, name, price) {  return (<div><img src={image} alt={name} /><h2>{name}</h2><span>{price}</span></div>  );}export default App;

I have also used forEach method but still getting the same issue.Earlier I have used same array with map function, it worked but not working in this code. If you have any solution please post it.


Viewing all articles
Browse latest Browse all 11601

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>