企业🤖AI智能体构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
[项目代码(持续更新......)](https://github.com/tjs5945111/dva-hooks-antd-) ### 1. 创建路由 ~~~ <Router history={history}> <Switch> <Route path="/" exact component={IndexPage} /> <Route path="/detail" exact component={DetailPage} /> <Route path="/" component={HomeIndexPage} /> </Switch> </Router> ~~~ ### 2. 创建登录界面 ### 3. 创建主页面 ### 4. 将主页面拆分为多个板块使用antd中的Layout布局 ### 5. 分别开发对应的模块(左菜单、右头部、右内容、右底部) ### 6. 左菜单使用Menu ~~~ <SubMenu key='/pc/source' title={<span><Icon type="file" /><span className="nav-text">资源管理</span></span>} > <Menu.Item key='/pc/source/system'><Link to='/pc/source/system'>系统</Link></Menu.Item> {/*<Menu.Item key='/home/pc/source/tool'><Link to='/home/pc/source/tool'>工具</Link></Menu.Item>*/} {/*<Menu.Item key='/home/pc/source/container'><Link to='/home/pc/source/container'>容器</Link></Menu.Item>*/} <Menu.Item key='/pc/source/service'><Link to='/pc/source/service'>服务</Link></Menu.Item> {/*<Menu.Item key='/home/pc/source/serversync'><Link to='/home/pc/source/serversync'>服务同步</Link></Menu.Item>*/} <Menu.Item key='/pc/source/topic'><Link to='/pc/source/topic'>专题资源</Link></Menu.Item> <Menu.Item key='/pc/source/dataContent'><Link to='/pc/source/dataContent'>数据资源目录</Link></Menu.Item> </SubMenu> ~~~ ### 7. 封装http请求 ### 8. 取数据进行页面渲染 ### 说明: ~~~ 1. 通过点击左侧菜单栏使用Link to将路径添加,在右content中监听路由变化加载相对应模块 2. 当登录成功后将路由跳转到默认页面 3. 登录成功后服务器会根据登录状态设置相应的cook,请求时没有相应的cook取不到相应的数据(后台操作) ~~~