--- order: 5 title: zh-CN: 切换菜单类型 en-US: Switch the menu type --- ## zh-CN 展示动态切换模式。 ## en-US Show the dynamic switching mode (between 'inline' and 'vertical'). ```jsx import { Menu, Switch } from 'antd'; import { MailOutlined, CalendarOutlined, AppstoreOutlined, SettingOutlined, } from '@ant-design/icons'; const { SubMenu } = Menu; class Sider extends React.Component { state = { mode: 'inline', theme: 'light', }; changeMode = value => { this.setState({ mode: value ? 'vertical' : 'inline', }); }; changeTheme = value => { this.setState({ theme: value ? 'dark' : 'light', }); }; render() { return (