摘要：前端世界发展迅速，几乎每隔几年就要出现一次重大技术革命，而这几年的前端框架更是层出不穷，比如React，Angular，和Vue。Angular当年刚出来的时候十分火热，但是这几年React发展的十分迅猛，在Githup关注度不断追赶着Angular，似乎大有超越的势态，作为一个前端工作者，熟悉和了解是非常有必要的，于是乎这次校园后台的审批管理前端项目就采用最新React技术来实现。

后台的审批管理主要是对照片的上传进行管理，通过后台审批管理来对手机端浏览的照片进行管理。功能上有页面切换，添加图片，添加分类，手机端预览这几大功能。页面切换通过父组件给子组件传递的函数和数据对页面上两个界面进行切换。添加分类图片对图片进行上传，通过H5技术在本地选择图片后可以对图片进行预览以及在描述框内看到默认的图片名称，并可以对描述内容进行修改，以及对上传的图片进行删除操作。添加分类是功能是对分类进行增删改的操作，并且显示添加的图片，并对其增删改和拖拽排序。手机端预览是预览手机端上面的效果。

关键词：React；图片上传管理；H5；拖拽排序；图片预览

目录

摘要

Abstract

1  绪论-1

1.1研究背景-1

1.2发展前景-1

1.3主要研究内容-1

2   React介绍-2

2.1 React发展背景-2

2.2 React基本介绍-2

2.3 React特点-2

2.4 React深入介绍及其优势-2

3.  ES6介绍-4

3.1 ES6发展史-4

3.2 ES6新特性-4

3.3 ES6发展前景-4

4  HTML5介绍-5

4.1 HTML5基本介绍-5

4.2 HTML5发展史-5

4.3 HTML5语言现状-5

4.4 HTML5发展前景-5

5  dva介绍-7

6. 基本功能的实现-8

6.1 页面切换功能-8

6.2 图片添加功能-8

6.3 图片添加后主页面展现-9

6.4 添加分类功能-11

6.5 手机预览功能-12

7.项目测试-13

7.1 页面切换功能的测试-13

7.2 分类添加功能的测试-13

7.3 添加图片功能的测试-18

结论-24

参 考 文 献-24

致    谢-25