js之element的黏贴上传多张单张图片

<el-form ref="form" :model="radiovaluer" label-width="80px" :rules="rules" > <el-form-item label="审批结果" prop="radiovalue"> <el-radio-group size="mini" v-model="radiovaluer.radiovalue" @change="modificationvalp"> <el-radio :label="1">通过</el-radio> <el-radio :label="0">不通过</el-radio> </el-radio-group> </el-form-item> <el-form-item label="审批意见" v-show="modificationval==1"> <ispInput v-model="radiovaluer.textareavalue" :limit="500" :inputSpan="16" :countSpan="6" placeholder="请输入详细沟通结果" ></ispInput> </el-form-item> <el-form-item label="审批意见" v-show="modificationval==2" prop="textareavalue" class="textareavalue"> <ispInput v-model="radiovaluer.textareavalue" :limit="500" :inputSpan="16" :countSpan="6" placeholder="请输入详细沟通结果" class="textareavaluer" ></ispInput> </el-form-item> <el-form-item label="图片上传" > <div class="blockimg"> <div class="blockimg-padding" v-for="(fit,index) in fileList" :key="index"> <i class="el-icon-close" @click="wipeimg(index)"></i> <el-image style="width: 100px; height: 100px" :src="fit" :preview-src-list="srcList"></el-image> </div> </div> <!-- on-remove移除文件列表 file-list上传的文件列表 --> <el-upload ref="uploadMutiple" class="upload-demo" :action="actionDomain " multiple drag :before-upload="beforeAvatarUpload" :show-file-list="false" :on-success="handleAvatarSuccess" :file-list="fileList" :headers="{ token: system_loginData.token, }" accept=".jpg,.jpeg,.png,.gif,.bmp,.pdf,.JPG,.JPEG,.PBG,.GIF,.BMP,.PDF" > <i class="el-icon-upload"></i> <div class="el-upload__text">将图片拖到此处，或<em>点击上传</em></div> <div class="el-upload__tip" slot="tip">注:请上传jpg,jpeg,png,gif等文件格式的图片</div> </el-upload> </el-form-item> <el-form-item> <span class="dialog-footer footer"> <el-button @click="closeDialog">取 消</el-button> <el-button type="primary" @click="check(form)">确 定</el-button> </span> </el-form-item> </el-form> </el-dialog> </div>

上面式html代码，下面的是js代码，可以黏贴上传多张单张图片，

handlePaste(event) { /* ClipboardEvent 对象剪贴板被修改时发生的事件，属于 ClipboardEvent 对象。 clipboardData 返回对象，其中包含受剪贴板操作影响的数据。 */ const items = (event.clipboardData || window.clipboardData).items; if (!items || items.length === 0) { this.$message.error("当前浏览器不支持本地"); return; }else{ this.file=[] } // 搜索剪切板items for (let i = 0; i < items.length; i++) { if (items[i].type.indexOf("image") !== -1) { this.file.push(items[i].getAsFile()) } } for(let i=0;i<this.file.length;i++){ if (!this.file[i]) { this.$message.error("粘贴内容非图片"); return; }else{ this.$refs.uploadMutiple.handleStart(this.file[i]);// 将粘贴过来的图片加入预上传队列 } } this.$refs.uploadMutiple.submit(); // 提交图片上传队列 },