vue 请求后台接口，进度条实时更新

情景1：for循环多次请求同一个接口

思路：

1. 定义一个全局变量 num
2. 每请求成功一次，变量累加 this.num=this.num+1
3. 通过钩子函数watch监听变量num
4. 在监听函数里面进行百分比计算 Math.round(num/(for循环的总次数)*100)，并动态绑定到进度条组件

情景2：上传或下载，只请求一个接口

使用 axios 的 onDownloadProgress 和 onUploadProgress 方法进行监听，代码如下：

	var form = new FormData()
    form.append('file', vm.$refs.upload.files[0])
    form.append('id', id)
    form.append('type', type)
    var config = {
        onUploadProgress: progressEvent => {
            var complete = (progressEvent.loaded / progressEvent.total * 100 | 0) + '%'
            this.progress = complete
        }
    }
    axios.post(`api/uploadFile`,
        form, config).then((res) => {
        if (res.data.status === 'success') {
            console.log('上传成功')
        }
    })