React - How to get property of an object inside an object

Question

I have an array of SidebarItems which accepts objects, inside the object there are 2 properties, name and route , I want to use name value as route value, but I am getting an error called Unexpected use of 'name' , here is my actual code

const SidebarItems = [
    {
        name: "Calendar",
        route: `/${name}`,
    },
];

export default SidebarItems;

Answer 1

You can't really reference the name like that. What you can do is to generate the array for example in the following way:

const SidebarItems = ['Calendar', 'Messages', 'Notifications'].map((itemName) => ({
   name: itemName,
   route: `/${itemName}`
}));

Answer 2

You need something like

const SidebarItems = ({ name, route }) => ([
    {
        name: "Calendar",
        route: `/${name}`,
    },
]);

export default SidebarItems;