el-upload 的属性 :file-list=“fileList“ 中的fileList值为空问题
代码】el-upload的属性file-list="fileList"中的fileList值为空问题。
·
<el-upload
class="upload-demo"
action="#"
:show-file-list="true"
:http-request="fileUpload"
:on-remove="handleRemove"
:before-remove="beforeRemove"
multiple
:file-list="fileList"
>
<el-button size="small" type="primary">点击上传</el-button>
<!-- <div slot="tip" class="el-upload__tip">
只能上传jpg/png文件,且不超过500kb
</div> -->
</el-upload>
data() {
return {
fileList: [], //附件上传
//富文本编辑器配置
editorOption: {
// Some Quill options...
},
noticeTypeList: [], //获取通知类型
NoticeShowTimeList: [], //获取通知展示时间
roleList: [], //获取角色信息
ruleForm: {
noticeTitle: "", //通知标题
noticeType: "", //通知类型
endTime: "", //截至日期
displayNum: "", //通知展示时间
recieverRoles: [], //可查看角色
noticeContent: "", //公告内容
fileId: [], //附件上传
},
}
}
//上传图片
async fileUpload(file) {
const data = new FormData();
data.append("file", file.file);
let res = await fileUpload(data);
console.log('33333',res)
//默认显示文件的名称是name,给的数据是fileName,
res.data.data = JSON.parse(
JSON.stringify(res.data.data).replace(/fileName/g, "name")
);
this.fileList.push(res.data.data);
let fileId = this.fileList.map((item) => item.fileId);
this.ruleForm.fileId = fileId;
},
//上传后再删除文件
handleRemove(file, fileList) {
this.fileList = fileList;
let fileId = this.fileList.map((item) => item.fileId);
this.ruleForm.fileId = fileId;
},
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${file.name}?`);
},
更多推荐
已为社区贡献2条内容
所有评论(0)