当前位置: 首页 > news >正文

组件上传图片不回显问题

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  //你要回显的图片路径
});

http://www.lryc.cn/news/500795.html

相关文章:

  • 【JavaWeb后端学习笔记】Spring AOP面向切面编程
  • 6.584-Lab5B
  • OceanBase 的探索与实践
  • 安卓调试环境搭建
  • 动画Lottie
  • C++感受14-Hello Object 封装版 - 上
  • 网络安全中大数据和人工智能应用实践
  • RISC-V架构下OP-TEE 安全系统实践
  • 40分钟学 Go 语言高并发:【实战】分布式缓存系统
  • [创业之路-186]:《华为战略管理法-DSTE实战体系》-1-为什么UTStarcom死了,华为却活了,而且越活越好?
  • python如何多行注释
  • 前端工程化面试题目常见
  • 定点数的乘除运算
  • 页面置换算法模拟 最近最久未使用(LRU)算法
  • Ubuntu与Centos系统有何区别?
  • RK3568平台开发系列讲解(pinctrl 子系统篇)pinctrl_debug
  • 避大坑!Vue3中reactive丢失响应式的问题
  • springSecurity权限控制
  • Pytorch训练固定随机种子(单卡场景和分布式训练场景)
  • Conda + JuiceFS :增强 AI 开发环境共享能力
  • 人工智能-人机交互的机会
  • 【系统架构核心服务设计】使用 Redis ZSET 实现排行榜服务
  • elasticsearch基础总结
  • 【慕伏白教程】Zerotier 连接与简单配置
  • Brain.js(九):LSTMTimeStep 实战教程 - 未来短期内的股市指数预测 - 实操要谨慎
  • C# 字符串(String)
  • 二进制文件
  • 【电子元器件】音频功放种类
  • linux之vim
  • QT的ui界面显示不全问题(适应高分辨率屏幕)