1、单图片上传
要实现图片上传，首先要知道上传文件的时候，表单或者请求提交的方式。
post提交的默认请求头是application/x-www-form-urlencoded;charset=UTF-8，这种方法是将参数以键值对的方式提交到后台，像下面这样。后台接收的时候只需要使用ctx.request.body来接收前台传来的参数。
但是这种请求头是能够传键值对，不能上传文件，要想上传文件就只能将请求头设置为
hearder:{ content-type:multipart/form-data }
这是一种上传二进制文件的方法，能够获取input为file里的文件内容，作为请求体里的内容发送给后台。那么问题来了，怎么取到这个file文件？
第一种方法，直接在form表单里提交，为form表单设置请求头，比如下面这样：
action是要提交到后台的接口，method是提交的方法，默认是get，这个不能忘记写！
在form表单里，为字段添加name,value属性，作为后台接受的字段。name是后台要接收的请求的参数，value是这个name对应的值，这两个在一起相当于传给后台了一个键值对。具体看下图：
前端发送的form表单
后台接收的时候就能获取到这些键值对，然后进行相应的操作。
表单中上传图片应该是最简单的方法，因为只需要给input添加一个name属性即可
这时候后台需要先处理这个图片，将图片保存到本地，需要
1、下载一个包 @koa-multer,下面是模块的相应配置，保存文件，给文件重命名，为了保证图片不会有重复。
2、在router引用这个upload文件，在路由写入方法，处理上传的文件，名字是前台文件的name值
3、取文件名字，ctx.req.file.filename ，处理字段存进数据库
注意，如果图片，文字混合上传，获取文字内容就需要使用ctx.req.body（这个暂时还没找到原因），单纯的上传键值对，用ctx.request.body
步骤1、
步骤2、
步骤3、
第二种方法：将这些值写在一个对象里，作为参数传给后台
比如这样，将对象作为post提交的参数，后台一样的接收。
获取input file中文件内容时需要在input框绑定ref,用来获取元素，通过this.$refs.code.files[0]获取文件内容，具体时间什么内容可以打印，看的更直观。
这种方法的好处在于可以接受成功的回调，进行后续的一些操作，比如跳转，或者接受状态码等等。缺点在于要把所有的字段重新拿过来，重新赋值。
在上传二进制文件时需要设置请求头header,像前边提到的的一样。
第三种方法：formData
首先需要了解formData到底是个什么东西，可以看做他就是一种form表单提交的另外一种方法，它提供的formData能够帮助我们进行文件二进制的编码，他默认的请求头就是二进制传输，所以我们省去了添加请求头的操作。下面看看怎么使用
三部曲：
1、实例化一个formData
2、为这个对象添加内容
3、将这个对象作为陈清秋参数发送
可以看到实例化的fd有一个自带的方法，append。它的作用就是往这个对象中添加文件集合，可以进行多次append，但是要记住你添加的顺序，因为后台在解析的时候需要拿相应的file文件。
接着上边的图来继续说多图片上传
不管是多图片还是什么文件上传，其原理就是把所有的file文件作为一个集合，可以说是一个数组，集体传给后台，后台拿到集合，再解析出来每一项，得到想要的值。
按照这个思路，其实第一种方案，就是直接在form表单里传值是最简单的方法。把每一个input type=file的文件的name值都写成一样的，比如：
<input type=file name='pic'/> //这个比如是一个单张的图片
<input type=file name='pic'/ multiple>//multiple是允许多个图片的file内置的属性 这个比如是一组图片
<input type=file name='pic'/> //比如这个是一个压缩包
现在就有了三种类型的文件，比如到最后form表单共传了4个文件，后台接收到四个文件，只需要分别解析出来即可
单文件多文件区别就在于，单文件是upload.single 多文件是upload.array 意思是接收到一个数组，第二个参数是文件数量的限制。
再说一下使用formData传递参数
和上个方法一样的场景，上传四个文件，下图是多个图片上传的一个组件
我现在要传递一个单独的一个图片文件，一个单独的压缩包文件，一个多图的组合文件。可以想到formData的一个append方法，把各个文件添加到实例化后的formdata中
再看看这张图，data是表单中的键值对的参数，fd被append了三次，多图上传那个又是一个两张图片的一个集合，现在就是有了四个文件在fd中。
现在要把二进制文件和普通文件一同上传，在axios的post中可以将参数放在params中，作请求头的参数，后台使用query接收参数，而文件和上图一样接收。
