vue 模板循环绘制多行上传文件功能实现
作者：CUI_PING
这篇文章主要为大家介绍了vue 模板循环绘制多行上传文件功能实现详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
循环绘制模板
我们在上传多个文件时， 循环绘制模板， el-upload 拿不到当前操作的节点 ， 可以在其外层增加一个div 加上点击事件，记下当前操作节点， 代码如下
<el-form-item
:label="val.label+'：'"
v-for="(val, key, index) of orther_license_info"
:key="key + '_'+index"
:prop="key">
<el-col :span="8">
<el-input
type="text"
readonly
v-model="conf[key]"
></el-input>
</el-col>
<el-col offset="1" :span="7">
<div @click="fileDivClick(key)">
<el-upload
:on-change="fileChange"
:show-file-list="false"
:auto-upload="false"
:accept="key!=='otherQualification'?'image/jpeg,image/png':'image/jpeg,.zip'"
>
<el-button slot="trigger" type="primary" style="width: 83px" >{{val.sltFlg?"已选择":"选择文件"}}</el-button>
<el-button class="margin-left-10" type="primary" @click="uploadFile(key)">上传文件</el-button>
</el-upload>
</div>
</el-col>
</el-form-item>事件
fileDivClick(curKey){
this.curKey = curKey
},
fileChange(file, fileList) {
}以上就是vue 模板循环绘制多行上传文件功能实现的详细内容，更多关于vue 模板循环上传文件的资料请关注脚本之家其它相关文章！