Javascript 在Vue.js中输出图像

我有一个laravel/Vue 2.0项目正在工作，需要帮助显示图像

我将图像上传到laravel控制器中，如下所示：

//将图像保存到磁盘
如果（$request->hasFile（'image'））{
$image=$request->file（'image'）；
$extension=$image->getClientOriginalExtension（）；
存储：：磁盘（'public'）->put（$image->getFilename（）。$扩展名，File：：get（$image））；
$article->image\u path=$image->getFilename（）。$extension；
}否则{
$article->image_path='holding.jpg'；
}

然后，我使用以下方法创建了一个存储链接：

php artisan storage:link

然后我这样说：

<img v-bind:src="'/storage/' + article.image_path" class="card-img-top" :alt="article.title">

---

因此，我得到了一张前端没有找到的图像。

我建议您使用Vue扩展为Firefox或Chrome检查

文章

值，并检查img标记，以了解发生了什么。

我建议您使用Vue扩展为Firefox或Chrome检查

文章

值，同时检查img标记，为了了解正在发生的事情。

所以这似乎是存储和laravel的问题

我更新了控制器，将图像直接存储在公用文件夹中

$image->move（公共路径（'/img/blog_images'），$image->getFilename（）。$extension，）；

然后在视图中点击该按钮

---

一切都很好

所以这似乎是存储和存储的问题

我更新了控制器，将图像直接存储在公用文件夹中

$image->move（公共路径（'/img/blog_images'），$image->getFilename（）。$extension，）；

然后在视图中点击该按钮

---

一切都很好

您是否已检查是否设置了

文章.image\u路径

？如果是，您能确认映像路径与URL中的路径匹配吗？如果找不到映像a）您的请求有问题（URL，或者可能是某些标题，可能是凭据（如果服务器需要），等等），或者b）您的服务器有问题（如：请求是它应该是的，但它配置错误，没有按预期响应。如果是a），修复请求。如果是b）修复服务器。然而，我认为这与Vue没有什么关系。您可以使用angular、react、vanilla或svelte，解决方法是相同的，与框架本身有点无关。检查浏览器控制台的网络选项卡以确定请求（通常为红色）并从那里开始。如果打开“网络”选项卡时该选项卡为空，请刷新该页面，您可能会看到有故障的页面。您是否已检查是否设置了

文章。image\u path

？如果是，您能确认映像路径与URL中的路径匹配吗？如果找不到映像a）您的请求有问题（URL，或者可能是某些标题，可能是凭据（如果服务器需要），等等），或者b）您的服务器有问题（如：请求是它应该是的，但它配置错误，没有按预期响应。如果是a），修复请求。如果是b）修复服务器。然而，我认为这与Vue没有什么关系。您可以使用angular、react、vanilla或svelte，解决方法是相同的，与框架本身有点无关。检查浏览器控制台的网络选项卡以确定请求（通常为红色）并从那里开始。如果打开“网络”选项卡时该选项卡为空，则刷新该页面，您可能会看到有故障的页面。因此，该图像在“网络”选项卡中获得200分，但我看到的唯一问题是

内容类型：text/html；charset=UTF-8

在响应中，它不是一个图像，或者后端提供了错误的内容类型。尝试在另一个选项卡中打开请求，右键单击网络选项卡中的请求，因此从请求中在新选项卡中打开图像只会给我一个新页面，因此我认为它不会被视为imageNew空白页面？检查它，查看源代码。。。也可以查看Laravel日志，如果有的话。因此，图像在网络选项卡中得到200分，但我看到唯一可能出现问题的是

内容类型：text/html；charset=UTF-8

在响应中，它不是一个图像，或者后端提供了错误的内容类型。尝试在另一个选项卡中打开请求，右键单击网络选项卡中的请求，因此从请求中在新选项卡中打开图像只会给我一个新页面，因此我认为它不会被视为imageNew空白页面？检查它，查看源代码。。。如果有，也可以查看Laravel日志。