Breaking News: Grepper is joining You.com. Read the official announcement!

list keys in react

afzal afzal answered on November 15, 2022 Popularity 9/10 Helpfulness 2/10

answer list keys in react

list keys in react

Comment

import React from "react";
import ReactDOM from "react-dom";
// Component to be extracted
function MenuItems(props) {
    const item = props.item;
    return <li>{item}</li>;
}
 
// Component that will return an
// unordered list
function Navmenu(props) {
    const list = props.menuitems;
    const updatedList = list.map((listItems) => {
        return <MenuItems key={listItems.toString()} item={listItems} />;
    });
 
    return <ul>{updatedList}</ul>;
}
 
const menuItems = [1, 2, 3, 4, 5];
 
ReactDOM.render(
    <Navmenu menuitems={menuItems} />,
    document.getElementById("root")
);

Popularity 9/10 Helpfulness 2/10 Language javascript

Source: www.geeksforgeeks.org

Tags: javascript list

Link to this answer
Share Copy Link