KEMBAR78
Arryof Object | PDF
Scribd
Upload
9 views2 pages

Arryof Object

The document is a React component named 'Demo' that displays product categories, items, and their respective products with prices. It contains two main categories: 'Electronics' and 'Home Appliances', each with various items and products listed. The component uses JSX to render the data in a structured format with headings and paragraphs.

Uploaded by

semichatgpt123
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
9 views2 pages

Arryof Object

The document is a React component named 'Demo' that displays product categories, items, and their respective products with prices. It contains two main categories: 'Electronics' and 'Home Appliances', each with various items and products listed. The component uses JSX to render the data in a structured format with headings and paragraphs.

Uploaded by

semichatgpt123
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

import React from "react";

import "./Demo.css";
const Demo = () => {
const data = [
{
categoryName: "Electronics",
items: [
{
itemName: "Mobile Phones",
products: [
{ price: "48000", productName: "iPhone 12" },
{ price: "58000", productName: "Samsung Galaxy S21" },
],
},
{
itemName: "Laptops",
products: [
{ price: "65000", productName: "MacBook Air" },
{ price: "98000", productName: "Dell XPS 13" },
],
},
],
},
{
categoryName: "Home Appliances",
items: [
{
itemName: "Vacuum Cleaners",
products: [
{ price: "35000", productName: "Dyson V11" },
{ price: "45000", productName: "Roomba i7" },
],
},
{
itemName: "Cleaners",
products: [
{ price: "37000", productName: "Dyson V12" },
{ price: "47000", productName: "Roomba i10" },
],
},
],
},
];

return (
<>
{data.map((category, i) => (
<div key={i} className="cattegory">
<h3>Categoryname:-{category.categoryName}</h3>
{category.items.map((item, j) => (
<div key={j} className="items">
<h4>Itemname:-{item.itemName}</h4>
{item.products.map((product, k) => (
<div key={k} className="products">
<p>
<strong>Price:</strong>
{product.price}
</p>
<p>
<strong>Productname:</strong>
{product.productName}
</p>
</div>
))}
</div>
))}
</div>
))}
</>
);
};

export default Demo;

You might also like