如上图所示,需要解决的问题就如图所示:
解决方案:
1.定位需要隐藏的虚框element;
2.设置虚框的style。
具体代码:(vue.js实现方案)
1. /隐藏定位的目标elementlet upload_div = $('.avatar-uploader-cover')[0].childNodes[0];// this.removeClassName(upload_div,'el-upload');upload_div.style.cssText = "display: none;";//设置目标element的style内容2. /显示定位的目标elementlet upload_div = $('.avatar-uploader-cover')[0].childNodes[0];// this.removeClassName(upload_div,'el-upload');upload_div.style.cssText = "";
3.具体的前端代码:
<el-uploadaction=""ref="template_cover"list-type="picture":limit = "parseInt('1')":on-exceed="limit_control":on-success="handleSuccess":before-upload="templateCoverbeforeUpload":on-change="figure_on_change":before-remove="berfore_figure_remove_handler":on-preview="on_preview_template_img":on-remove="handleRemove":auto-upload="false"class="avatar-uploader-cover"accept=".jpg, .png, .jpeg">
其中avatar-uploader-cover就是其class,也是用来定位的标准;
4.简单解析一下网页源码中el-upload里的元素结构: