en-US

There are multiple levels in the menu.

zh-CN

菜单里有多个层级。

import { DownOutlined } from '@react-devui/icons';
import { DDropdown, DButton } from '@react-devui/ui';

const list = [
  { id: 'Item1', label: 'Item 1', type: 'item' },
  { id: 'Item2', label: 'Item 2', type: 'item', disabled: true },
  {
    id: 'Sub3',
    label: 'Sub 3',
    type: 'sub',
    children: [
      { id: 'Item31', label: 'Item 31', type: 'item' },
      { id: 'Item32', label: 'Item 32', type: 'item', disabled: true },
      {
        id: 'Sub33',
        label: 'Sub 33',
        type: 'sub',
        children: [
          { id: 'Item331', label: 'Item 331', type: 'item' },
          { id: 'Item332', label: 'Item 332', type: 'item', disabled: true },
        ],
      },
    ],
  },
  {
    id: 'Sub4',
    label: 'Sub 4',
    type: 'sub',
    children: [{ id: 'Item41', label: 'Item 41', type: 'item' }],
  },
];
export default function Demo() {
  return (
    <DDropdown dList={list}>
      <DButton dType="secondary" dIcon={<DownOutlined />} dIconRight>
        Cascading menu
      </DButton>
    </DDropdown>
  );
}