伪类不是真正的DOM，不能被js的选择器选择，所以不能绑定事件

Question

上传数据到服务器出现浏览器崩溃问题

上传数据比较多，其中包括2到3个base64

相关代码

  <Upload :show-upload-list="true" :headers="{'token':user}" 
  accept="application/pdf"
  multiple
  action="//jsonplaceholder.typicode.com/posts/"
  :on-success="handleSuccess" 
  :before-upload="handleBeforeUpload">
  <Button type="ghost" icon="ios-cloud-upload-outline">文件上传</Button>
  </Upload>
          
handleBeforeUpload(file) {  var reader = new FileReader();
  reader.readAsDataURL(file);

  reader.onloadend = () => {    this.upList.push(reader.result);    this.$set(this.list, "value", this.upList);

    console.log(this.list);
  };  return false;
},

数据保存成功，并且不是很慢

错误如下：

Answer 1

出现浏览器崩溃的原因是，你浏览器占用的内存爆仓了。你的reader.onloadend方法把base64的数据都存起来了，这里是存到内存当中，当数据量很大的情况下，就会出现内存爆仓，浏览器没有额外的内存去正常运行了。你需要限制一下上传文件的大小，当文件过大的情况下，推荐采用 分片上传技术，使用类似于js-spark-md5前端js类库。