element el-upload 粘贴上传图片

对form中的某一个el-form-item添加 @paste.native 事件，事件绑定方法名 handlePaste也可以在其他控件中添加事件监听，这里在当前form-item 这个块使用了，只有当你点击目标区域时才有效。

<el-form-item label="备注图片" @paste.native="handlePaste">
							<div style="color: red;">可粘贴上传</div>
							<div class="imgs">
								<div class="i" v-for="(item, index) in addFormData.imgs" :key="index">
									<img :src="item" alt="">
									<i class="el-icon-error" @click="addFormData.imgs.splice(index, 1)"></i>
								</div>
								<el-upload class="avatar-uploader" :action="uploadAction" :show-file-list="false"
									multiple ref="upload" :headers="uploadHeaders" 
									:on-success="handleUploadSuccess">
									<i class="el-icon-plus avatar-uploader-icon"></i>
								</el-upload>
							</div>
						</el-form-item>

通过ref来调用自身的方法比如 handlerStart，handlerSuccess这些都是el-upload身上的方法，这里的ref为 upload。

handlePaste(e) {
			let now = new Date().getTime()
			if (now - this.timeStep < 500) {
				this.$message.warning('粘贴速度太频繁！请稍后再试');
				return
			}
			this.timeStep = now
			var clipboardData = e.clipboardData; // IE
			if (!clipboardData) {
				//chrome
				clipboardData = e.originalEvent.clipboardData;
			}
			var items = '';
			items = (e.clipboardData || window.clipboardData).items;
			let file = null;
			if (!items || items.length === 0) {
				this.$message.error('当前浏览器不支持粘贴本地图片，请打开图片复制后再粘贴！');
				return;
			}
			// 搜索剪切板items
			for (let i = 0; i < items.length; i++) {
				// 限制上传文件类型
				if (items[i].type.indexOf('image') !== -1) {
					file = items[i].getAsFile();
					break;
				}
			}
			//判断是否超出上传数量
			// if (this.addFormData.imgs.length >= this.limit) {
			// 	this.$message.error(`上传文件数量不能超过 ${this.limit} 个!`); // 图片数量超出
			// 	return
			// }
			if (file) {
				this.$refs.upload.handleStart(file); // 将粘贴过来的图片加入预上传队列
				this.$refs.upload.submit(); // 提交图片上传队列
			}else{
				this.$message.error("粘贴内容非图片");
			}
		},
		//图片上传成功
		handleUploadSuccess(response, file, fileList) {
			this.addFormData.imgs.push(response.url)
		},