关于prolayout组件：ProLayout高级布局🏆 让中后台开发更简单 包含 table form 等多个组件。https://procomponents.ant.design/components/layout

// tsx文件
import ProLayout from '@ant-design/pro-layout';
...
const [collapsed,setCollapsed]=useState(false);...
return (
...<ProLayoutcollapsed={collapsed}collapsedButtonRender={()=>{return(<divclassName={collapsed ? 'collapsed' : 'expanded'}onClick={()=> setCollapsed(!collapsed)}style={{cursor: 'pointer',fontSize:'15px',width:'20px',}}>  {collapsed?<RightCircleTwoTonestyle={{fontSize:'25px',}} />:<LeftCircleTwoTone style={{fontSize:'25px',}}/>}</div>);}}
...>
</ProLayout>//less文件.expanded {position: fixed;top: 50%;left: 245px;font-size:20px
}.collapsed {position: fixed;top: 50%;left: 50px;font-size:20px
}

最终实现的样式如图：

收起：

展开：