Vue图像Src绑定未显示

Posted 2023-02-22

【中文标题】Vue图像Src绑定未显示

【英文标题】：Vue image Src binding not showing

【发布时间】：2020-04-10 17:06:49

【问题描述】：

您好，我正在创建上传图片，但在预览图片上遇到问题我已经看到此解决方案并尝试复制文件被选中并看到 Blob URL，但我在 URL 上遇到问题并更新这里是文章的链接。此外，如果可以将上传更改为仅针对图像文件。

Seen solution for Upload

html 代码

  <input type="file" @change="uploadImageChange"/>
          <div class="dashboard-Image-modal__previewUploadImage">
              <img if="imageSelectedUrl" :src="imageSelectedUrl"/>
          </div>

方法

data()
return 
   imageSelectedUrl:null
;
    ,

methods:
uploadImageChange(e)
      const file = e.target.files[0];
      this.imageSelectedUrl = URL.createObjectURL(file);
    

【问题讨论】：

你的代码适合我：jsfiddle.net/teddyrised/eq49yd6m

【参考方案1】：

我想我找到了问题，你写：

data()
   return 
       imageSelectedUrl:null
   ,

你错过了。 试着写：

data () 
        return 
            imageSelectedUrl: null
        
    ,

【讨论】：

啊抱歉，我只是在此处传输代码时打错了。但在我的应用程序上它有。