问题背景
在做员工系统时,前端传递图片文件给后端,后端返回的图片路径为姓名+员工部门,此时重新以当前员工身份传递图片时,后端返回的路径仍然为当前员工姓名与员工部门,此时我们传递的新图片已经保存到了后端数据库中。因为后端返回的图片路径不变,导致前端图片不会重新请求数据。
解决办法
我们需要使图片路径不完全相同,才会使得img标签会重新请求新的图片,这时我加入了随机数进行更改图片的完整路径,但不影响图片向真正的地址去请求数据。
代码:
/* 上传头像成功时的回调 */
handleAvatarSuccess(res, file) {
console.log(res,file)
if(res.code == 200){
this.$message.success("上传成功")
}
//在请求到的图片路径后方加入随机数,使得每次渲染的完整图片路径都不相同,使得图片重新加载
this.imageAvatarUrl = res.data + '?'+ Math.random();
},
问题解决~