vue实现一个类似头像上传的功能，利用input type="file"实现，作用大概就是本地选择图片然后上传到服务器，上传失败回滚到之前的样子
html：

<form action="" enctype="multipart/form-data" method="post" name="form1" id="form1">
       文件：<input type="file" name="myFile" id="myFile" @change="getFileContent();">
</form>
    
<!-- 图片展示区域 -->
<div id="imgList" style="width: 100px;height:100px;">
    <img src="123.jpg" alt="" style="width:100%;height: 100%;">
</div>

</div>

js

 getFileContent(){
   var reader = new FileReader();
   var file = document.querySelector("#myFile").files;
   reader.readAsDataURL(file[0]);

   reader.onload = function(){
       let oimg = document.querySelector("img")
       oimg.src = reader.result;
       this.axios.post('xxx',{
            img:reader.result;
       })
       .then{...}
       .catch{
            // reset
            oimg.src = '123.jpg'
       }
   }
   
 }

因为file这个对象是只读属性，所以不能修改
求大神怎么办？或者有没有更好的方法