SolidJSS
SolidJS2y ago
11 replies
Wes

How to create a nested menu from a nested object?

I'm building a system where I have data from an external source that is structured as an object with nested levels, such as:

const menu = {
  id: 1,
  label: "One",
  items: [
    {
      id: 2,
      label: "Two",
      items: [
        {
          id: 3,
          label: "Three",
        },
      ],
    },
  ],
};


It can have an arbitrary number of options and submenus.

How do I make a <Menu /> component that reacts to this object and renders recursively?

My current solution is passing the properties after reading them, which is not reactive and therefore never updates.
Was this page helpful?