Upload component

<el-upload :before-upload="handleAvatarSuccess" :show-file-list="false" class="upload-demo" action="" style="width: 200px; float: left; margin-right: 10px" list-type="picture"> <div v-if="! imgUrl.front" class="avatar-uploader-icon"> <i class="el-icon-loading"/> </div> <img v-if="imgUrl.front" :src="imgUrl.front" width="200px" height="120px" alt=""> <el-button size="small" style="margin-left: 90px" type="primary"> Select image </el-button> </el-upload>Copy the code

2. Write logic in handleAvatarSuccess to convert file to base64

HandleAvatarSuccess (file) {const _this = this const r = new FileReader() r.readasDataURL (file) r.onload = Function (e) {_this.imgurl. front = e.target.result} // this.fileList is a formData object this.imlist.append ('fileList', file, 'bb') }Copy the code

3. Click the button to upload multiple files

UpdateIdcard (this.imglist, this.checkData.id). Then (res => {this.$message. Success (' updateIdcard(this.imglist, this.checkData.id). ') this.dialogVisible2 = false }).catch(err => { this.$message.error(err) })Copy the code