codedamn

Making categories dynamic

Created by Codedamn about a year ago

0

No description provided

2 Comments

    0

    import React, { useState } from "react"; import Menu from "./Menu"; import Categories from "./Categories"; import items from "./data";

    function App() { const [menuItems, setMenuItems] = useState(items);

    // Dynamically calculate unique categories within the component const categories = Array.from(new Set(items.map(item => item.category)));

    const filterItems = (category) => { if (category === "all") { setMenuItems(items); } else { setMenuItems(items.filter((item) => item.category === category)); } };

    return ( <main> <section className="menu section"> <div className="title"> <h2>our menu</h2> <div className="underline"></div> </div> <Categories categories={categories} filterItems={filterItems} /> <Menu items={menuItems} /> </section> </main> ); }

    export default App;

    @shivamkumar0251

    Shivam Kumar

    @shivamkumar0251

    0

    plz replay..

    @shivamkumar0251

    Shivam Kumar

    @shivamkumar0251

Your comment