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.