上传文件、图片

iview上传文件

<Upload
	ref="upload"
	:before-upload="handleUpload"
	:show-upload-list="false"
	:on-success="uploadSuccess"
	:on-error="uploadError"
	:format="['xlsx']"
	:max-size="2048"
	:on-exceeded-size="handleMaxSize"
	:on-format-error="handleFormatErrorExcel"
	:data="{projectType:code}"
	name='upload'
	action="/api/project/batch_import">
	<Button>导入</Button>
</Upload>
/*
before-upload:上传文件之前的钩子，参数为上传的文件，若返回 false 或者 Promise 则停止上传
format:支持的文件类型，与 accept 不同的是，format 是识别文件的后缀名，accept 为 input 标签原生的 accept 属性，会在选择文件时过滤，可以两者结合使用
on-exceeded-size:文件超出指定大小限制时的钩子，返回字段为 file, fileList
on-format-error:文件格式验证失败时的钩子，返回字段为 file, fileList
name:上传的文件字段名
data:上传时附带的额外参数
action:上传的地址，必填
*/
/**导入 */
    handleUpload (file) {
      let keyID = Math.random().toString().substr(2);
      this.up_file = true;
    },
    uploadSuccess (res, file) { 
      this.up_file = false; 
      if(res.code == 200){
        this.$Message.info(res.msg);
      }else{
        this.$Message.error({
            content: res.msg,
            duration: 30,
            closable: true
        });  
      } 
      this.getList();
    },
    uploadError(error, file) { 
      this.up_file = false;
      this.$Message.error({
          content: error,
          duration: 30,
          closable: true
      });
    },
    handleMaxSize(file){
      this.up_file = false; 
      this.$Message.error({
          content: '文件大小不能超过 2M.',
          duration: 10,
          closable: true
      });
    },
    handleFormatErrorExcel (file) {
      this.up_file = false;
      this.$Message.error({
          content: "文件格式不正确,请上传模板的excel格式文件",
          duration: 10,
          closable: true
      });
    },
    /**导入结束 */

element上传图片

<el-upload
	action="/etrc/api/expert/attachment/upload"
	list-type="picture-card"
	:headers="{processData: false,contentType: false}"
	name="Filedata"
	:data="{savePath:'',noValidateType:1}"
	:on-preview="handlePictureCardPreview"
	:on-remove="attachmentRemove"
	:file-list="attachmentList"
	:on-success="uploadAttachmentSuccess">
	<i class="el-icon-plus"></i>
</el-upload> 
<el-dialog :visible.sync="dialogVisible">
	<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
//附件卡片列表
handlePictureCardPreview(file) {
	this.dialogImageUrl = file.url;
	this.dialogVisible = true;
},
//删除附件
attachmentRemove(file, fileList) {
	let id = file.id;
	var _this = this;
	axios.get('/etrc/api/expert/attachment/delete?id='+id).then(function(res){
	console.log(res)
	if(res.data.code == 200){
	let index = _this.attachments.indexOf(id);
	if(index > -1){
	_this.attachments.splice(index,1); 
	} 
	_this.$message('删除成功'); 
	}
	})

}, 
//附件上传成功
uploadAttachmentSuccess(response){
	console.log(response);
	if(response.code == 200){
	this.attachments.push(response.info.id);
	this.attachmentList.push(response.info); 
	}else{
	this.$notify.error({ title: '错误', message: res.msg });
	}
},