javascript - Vue NuxtJS 自定义图像标签未加载我的 src

Question

我想在 NuxtJS 中创建一个自定义图像组件（传递 rgb 颜色并自动为图像着色），但是当我的 CustomImage 组件中的 img 获得通过的路径时，它无法加载我的图像。

错误：

logotext.png:1 GET http://localhost:8080/@/assets/images/logotext.png 404 (Not 
Found)

我的自定义图像：

<template>
  <img  :src="src" :alt="alt" />
</template>

<script lang="ts">
import Vue from 'vue';
import { Component, Prop } from 'nuxt-property-decorator';

@Component({})
export default class CustomImage extends Vue {
  @Prop({
    type: String,
    required: true,
  })
  public src!: string;
  @Prop({
    type: String,
    required: true,
  })
  public alt!: string;
}
</script>

Answer 1

images在目录中创建一个名为的文件夹static并将图像移动到其中，然后按如下方式使用它们：

 <CustomImage src="/images/logotext.png" alt="Logo" />

/指的是静态目录。

检查此以获取更多详细信息