上传暂存

src/components/Upload.vue

@@ -1,6 +1,7 @@
 <template>
   <div>
     <el-upload
+      v-loading.fullscreen.lock="mark"
       ref="upload"
       :action="newUrl"
       :headers="myHeaders"
@@ -9,6 +10,8 @@
       :limit="limit"
       :file-list="imgList"
       :on-success="handleAvatarSuccess"
+      :on-error="handleError"
+      :on-progress="onProgress"
       :disabled="limit <= value.length"
     >
       <i slot="default" class="el-icon-plus" />
@@ -41,6 +44,9 @@
     <el-dialog :visible.sync="dialogVisible" :modal="false">
       <img width="100%" :src="dialogImageUrl" alt="" />
     </el-dialog>
+    <!-- <el-button type="primary" >
+      指令方式
+    </el-button> -->
   </div>
 </template>
 
@@ -70,6 +76,7 @@ export default {
   },
   data() {
     return {
+      mark: false,
       url: UPLOAD_URL,
       dialogImageUrl: '',
       dialogVisible: false,
@@ -112,6 +119,13 @@ export default {
   },
 
   methods: {
+    onProgress() {
+      this.mark = true;
+    },
+    handleError() {
+      this.mark = false;
+      this.$error('上传失败，请稍后重试...');
+    },
     handleAvatarSuccess(res, file, fileList) {
       if (file.response.code !== 200) {
         this.$refs.upload.clearFiles();
@@ -119,7 +133,6 @@ export default {
         this.$emit('input', []);
         return false;
       }
-      console.log(file);
       const result =
         fileList.length > 0
           ? fileList.map(x => ({
@@ -130,6 +143,7 @@ export default {
           : [];
       this.$nextTick(() => {
         this.$emit('input', result);
+        this.mark = false;
       });
     },
     // handleChange(file, fileList) {