组件上传图片不回显问题
import { Plus } from "@element-plus/icons-vue";
// 图片上传
const img_add = ref([]);
function httpRequest_add(option) {
let dataForm = new FormData();
dataForm.append("file", option.file);
dataForm.append("id", user.data.id);
axios({
url: "",//你的图片上传接口
method: "post",
data: dataForm,
headers: {
// 设置请求头
token: user.data.token,
id: user.data.id
}
}).then(res => {
console.log(res);
// 表单校验
ruleForm.avatar = res.data.data.id;
// 回显图片
img_add.value.push({
url: res.data.data.url
});
});
}html：
<el-upload :http-request="httpRequest_add" multiple :show-file-list="true"
limit="1" :file-list="img_add" :class="{ hide_box: img_add.length }" ref="uploadrefss"
v-model="rules.avatar" list-type="picture-card">
<el-icon>
<Plus />
</el-icon>
</el-upload>img_add.value.push({
url: res.data.data.url //你要回显的图片路径
});
是关键