html表格中如何插图片不显示,Element UI table里上传图片后如何显示在表格里

问题描述

写了一个后台管理系统，需求是通过新增按钮，弹出一个dialog来上传 图片，详情(文章)，视频。

不太明白这整个逻辑怎么实现。

问题出现的环境背景及自己尝试过哪些方法

现在的问题就是我在dialog里上传的图片赋值给了上传图片的小dialog，之后怎么在提交过程中传给table里我定义的imgPath。

相关代码

这一部分是table的

这一部分是dialog的，取自element官网上的upload

action="https://jsonplaceholder.typicode.com/posts/"

list-type="picture-card"

:on-preview="handlePictureCardPreview"

:on-remove="handleRemove">

methods函数里

// 新增

handleAdd(row) {

this.form = {

imgPath: null,

detailURL: "",

videoURL: "",

status: 0

};

this.addVisible = true;

this.$nextTick(() => { // DOM 异步更新

this.$refs['form'].clearValidate(); // 移除校验效果

})

},

// 图片上传

handleRemove(file, fileList) {

console.log(file, fileList);

},

handlePictureCardPreview(file) {

this.dialogImageUrl = file.url;

this.dialogVisible = true;

},

希望能给个实例，或者能帮我讲讲这中间逻辑，有点懵了