相同的 blade 组件在一个视图中正确显示，而在其他视图中不显示来自 public 文件夹的图像

Question

我正在使用 Laravel 8 构建一个网站，其中有一个名为 app.blade.php 的组件。

此组件是项目的主体，包括导航栏。

我面临的问题是这个组件在每个视图中都正确显示，而在名为 article.blade.php 的视图中它显示但没有显示徽标图像，只有 ALT 文本。

我也试过在视图中使用其他图像，但没有显示任何图像，而在其他视图中一切都是正确的。

目前的图片在public文件夹中，稍后我会把所有东西都移动到存储中。

这是我的组件

<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- CSRF Token -->
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <title>{{ config('app.name', 'Laravel') }}</title>

    <!-- Scripts -->
    <script src="{{ asset('js/app.js') }}" defer></script>

    <!-- Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500&family=Readex+Pro:wght@200;300;400;500;600;700&display=swap" rel="stylesheet">

    {{-- Icone --}}

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.0/css/all.min.css" integrity="sha512-10/jx2EXwxxWqCLX/hHth/vu2KY3jCF70dCQB8TSgNjbCVAC/8vai53GfMDrO2Emgwccf2pJqxct9ehpzG+MTw==" crossorigin="anonymous" referrerpolicy="no-referrer" />

    <!-- Styles -->
    <link href="{{ asset('css/app.css') }}" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Glide.js/3.2.0/css/glide.core.css" integrity="sha512-ShLuspGzRsTiMlQ2Rg0e+atjy/gVQr3oYKnKmQkHQ6sxcnDAEOtOaPz2rRmeygV2CtnwUawDyHkGgH4zUbP3Hw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
    <div id="app">
        <x-navbar/>

        <main>
            {{$slot}}
        </main>
    </div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Glide.js/3.2.0/glide.js" integrity="sha512-vZGsugWaSqQZuW8N5Z3ild7Tk8NqiZjKffeIQGpnnIs6g7HVZaFZjlLKPIw1qDsrQ5KAxAGfBinglQWu6i/8DA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</body>
</html>

我是这样称呼它的：

<x-app></x-app>

有人知道它可以依赖什么吗？对我来说，它在所有其他视图上都能正常工作，这听起来很奇怪。

谢谢。

Answer 1

在显示图像的代码中，您可能使用了与当前路线相对的路径。

需要使用绝对路径（以 / 开头）或使用 asset() 帮助程序加载图像。

由于您没有显示违规代码，因此很难给出具体建议

相同的 blade 组件在一个视图中正确显示，而在其他视图中不显示来自 public 文件夹的图像

Same blade component showing correctly in one view and not showing image from public folder in other views

php

laravel

components

laravel-8

laravel-blade