[项目代码(持续更新......)](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取不到相应的数据(后台操作)
~~~
- 第一章 起步
- 第1节 创建react项目
- 第2节 hello world
- 第3节 数据绑定+事件处理
- 3.1 for循环事件处理中的传参写法、条件渲染
- 第4章 点击切换文字
- 第5章 使用html写react
- 第二章 运用
- 第1节 循环
- 第2节 实现一个简单的TodoList
- 第2.1节 删除
- 第3节 父子组件传参
- 1. 父组件向子组件传参
- 2. 子组件向父组件传参
- 第4节 react-router实现一个简单路由
- 第5节 生命周期
- 第6节 取数据
- 第 7节 获取dom节点
- 第8节 双向数据绑定
- 第三章 redux
- 第1节 介绍
- 第2节 安装redux
- 第3节 使用
- 3.1 action
- 3.2 使用redux实现 todolist
- 第4节封装redux中的action
- 第5节 redux-thunk中间件
- 5.1介绍
- 5.2使用
- 第四章 ant-design前端ui
- 第一节 安装
- 第2节 使用
- 2.1 ant-design实现todoList增删功能
- 第3节 使用整理
- 第五章 vue和react的比较
- 第六章 dva.js轻量级应用框架
- 第1节 介绍
- 第2节 安装dva
- 第3节 页面跳转
- 1. 事件路由跳转
- 2. 通过路由跳转
- 第4节 组件之间通信
- 1. 父组件向子组件传参
- 2. 子组件向父组件传参
- 第5节 事件处理
- 第6节 发送请求
- 1. 通过路由判断页面渲染数据
- 2. 通过事件发送请求
- 第7节 运用
- 1. TodoList
- 1.添加数据
- 1.2输入框敲回车触发事件
- 2.删除数据
- 3. 总结
- 第8节 配合antd使用
- 1. 引入antd
- 2.dva 使用antd注意事项
- 3. 知识点整理
- 第七章 dva后台项目实战
- 第1节 登录加密
- 1.具体实现
- 第2节 知识点
- 第3节 树结构
- 第八章 react新特性 hooks
- 第1节 hooks介绍
- 第2节 useState的使用
- 第3节 useEffect的使用
- 第4节 dva+antd+hooks企业后台项目开发流程
- 第 5节 hooks 使用
- 运用
- 第6节 hook整理
- 第7节 react memo
- 第九章 react中使用Echarts
- 知识点
- react中使用mobx
- 知识点
- react中使用rem
- 递归实现目录数
- react使用图表
- react 同步更新策略
- antd tree默认展开无效
- ts中lint修复篇
- React-query方案
- 高阶组件