使用Element UI手动上传单个文件并显示进度条

场景描述

使用Element UI的upload组件手动上传文件单个文件，如果选择了多个文件，会覆盖原来要上传的文件，以最新选择的文件为准。上传不使用upload组件自带的上传方式，而是使用axios上传。

实现过程

部分做法参考自：https://www.cnblogs.com/lovemomo/p/11777608.html

首先upload的html代码如下：

<el-upload
  class="upload-demo"
  ref="upload"
  action
  :before-upload="beforeUploadVideo"
  :on-change="handleChange"
  :file-list="fileList"
  :auto-upload="true"
>
  <el-button slot="trigger" size="small" type="primary"
    >选取文件</el-button
  >
</el-upload>

为了只能选择一个文件，我们需要利用on-change方法，始终令file-list保留最新的一项。并且，为了能用axios上传该文件，