React中使用antd组件的方法

　　import {

　　AppstoreOutlined,

　　ContainerOutlined,

　　DesktopOutlined,

　　MailOutlined,

　　MenuFoldOutlined,

　　MenuUnfoldOutlined,

　　PieChartOutlined,

　　} from '@ant-design/icons';

　　import { Button, Menu } from 'antd';

　　import React, { useState } from 'react';

　　function getItem(label, key, icon, children, type) {

　　return {

　　key,

　　icon,

　　children,

　　label,

　　type,

　　};

　　}

　　const items = [

　　getItem('Option 1', '1', ),

　　getItem('Option 2', '2', ),

　　getItem('Option 3', '3', ),

　　getItem('Navigation One', 'sub1', , [

　　getItem('Option 5', '5'),

　　getItem('Option 6', '6'),

　　getItem('Option 7', '7'),

　　getItem('Option 8', '8'),

　　]),

　　getItem('Navigation Two', 'sub2', , [

　　getItem('Option 9', '9'),

　　getItem('Option 10', '10'),

　　getItem('Submenu', 'sub3', null, [getItem('Option 11', '11'), getItem('Option 12', '12')]),

　　]),

　　];

　　const App = () => {

　　const [collapsed, setCollapsed] = useState(false);

　　const toggleCollapsed = () => {

　　setCollapsed(!collapsed);

　　};

　　return (

　　style={{

　　width: 256,

　　height: '100%'

　　}}

　　>

　　type="primary"

　　onClick={toggleCollapsed}

　　style={{

　　marginBottom: 16,

　　}}

　　>

　　{collapsed ? : }

　　defaultSelectedKeys={['1']}

　　defaultOpenKeys={['sub1']}

　　mode="inline"

　　theme="dark"

　　inlineCollapsed={collapsed}

　　items={items}

　　style={{height:'100%'}}

　　/>