Question

我正在使用vue中的axios更新图像。当图像响应返回时，我尝试更新其路径。但这给了我错误

Error in v-on handler: "Error: Cannot find module './1605078376.jpeg'"

可能是它试图在将图像保存到磁盘之前获取图像。

这是我的代码

 axios.post('/api/user/change-avatar', formData,{
         headers: {
                    'Content-Type': 'multipart/form-data'
                }
      }).then(response => {
        if(response.data.status == 'success'){
         this.avatar = response.data.avatar;
         this.url = require(`@assets/images/avatars/${this.avatar}`)
        }
        this.showUpdateAvatar()  
   
      })

可能是什么问题？

Answer 1

您只能做以下事情，而不是做this.url = require(xxx)：

   <img :src="require(`/assets/images/avatars/${url}`)">

   <script>
      axios.post('/api/user/change-avatar', formData,{
         headers: {
                    'Content-Type': 'multipart/form-data'
                }
      }).then(response => {
        if(response.data.status == 'success'){
         this.avatar = response.data.avatar;
         this.url = this.avatar
        }
        this.showUpdateAvatar()  
   
      })
   </script>

确保src路径正确进入/ avatars文件夹。您可能需要像在..之前在/assets之前添加几个../assets/xxx。另外，请确保将url设置为默认值，以便在进行响应时，仍会向客户端显示图像。

最后，请注意，您不能在@内添加require！所以你不能要求（'@ / assets / xxx'）！

Vue图片网址未在Vue中更新

1 个答案: