elementUI里面upload组件上传图片时选择图片之后不显示图片的问题,

在upload组件里面上传图片之后 不显示

  
  



这个问题的原因是因为 upload组件的有一个自动上的属性auto-upload默认值是true,也就是说当用户选择图片之后就会立即上传。这时如果上传地址接口有问题的话就会到时 上传不成功没有办法触发handleAvatarSuccess这个钩子函数。导致没有渲染出图片。

  • 解决

在项目中 一般都是用户点击按钮之后才会进行 往后台数据库插入的操作
所以我们一般会把 auto-upload属性设置成false,通过组件的submit()方法来提交文件
为了解决这个问题 我们就需要在其他的钩子函数里 来触发给渲染图片的区域赋值图片的地址、
我们可以在 on-change这个钩子函数里面来做这个事情 this.imageUrl=URL.createObjectURL(file.raw);

	
		  
		  
	
	 handleAvatarChange(file,filelist){
	        this.imageUrl=URL.createObjectURL(file.raw);
	 }

然后我们在每次打开弹窗时、清除掉图片的地址就好了 this.imageUrl=“”

  • 可能有更好的解决方法 希望大家多多交流

你可能感兴趣的:(elementUI里面upload组件上传图片时选择图片之后不显示图片的问题,)