如何在 laravel nova 自定义卡中显示图像？答案

【问题标题】：How to show image in laravel nova custom card?如何在 laravel nova 自定义卡中显示图像？
【发布时间】：2021-11-27 10:04:26
【问题描述】：

我已经创建了自定义 laravel nova 卡片，它显示如下项目列表：

menus:[
    {
        logo: require("../assets/client.png"),
        name: "Clients",
        redirection: "clients"
    }
]

以下是模板代码：

<div v-for="menu in menus" :key="menu">
   <a @click="handleMenuClick(menu.redirection)">
      <img :src="menu.logo" />
      {{ menu.name }}
   </a>
</div>

我的vue组件路径是/resources/js/components/

我在资源中创建了assets文件夹，它的路径是/resources/js/assets/

我的问题是我无法在浏览器中显示图像。

vue 组件编译完成后，dist 文件夹包含名为 images 的子文件夹，其中包含 client.png -> dist/images/client.png

控制台错误提示：http://localhost/images/client.png?7a01645624dc771389bae59e51ffd40d 404 (Not Found)

【问题讨论】：

标签： vue.js vuejs2 vue-component laravel-nova

【解决方案1】：

我设法解决了它

我将图像移到 public/assets/ 文件夹中并更改了以下内容

    menus:
    [
      {
        logo: require("/assets/client.png"), //change
        name: "Clients",
        redirection: "clients"
      }
    ]

（就我而言）这解决了我的问题。

【讨论】：