Как импортировать картинку для img в vue?

Question

imeyuves @imeyuves

Vue.js

Как импортировать картинку для img в vue?

В общем расположение такое

- src
  - assets
     - img.png
  - components
    - Component.vue
  - App.vue

Component.vue

<template>
    <img src="../assets/img.png"
</template

App.vue

<template>
    <img src=". /assets/img.png"> 
</template>

В App.vue, что и понятно, все работает, но не в Component.vue
Можно ли как то обойтись без перемещения картинки в components?

Вопрос задан более года назад
188 просмотров

Комментировать

Подписаться 1 Простой Комментировать

Answer 1 · 2024-04-03 22:10:19

Засунуть путь к картинке в props компонента

Component.vue
<script setup lang="ts">
const props = defineProps<{
    imgSrc: string
}>()
</script>
<template>
    <img :src="props.imgSrc" />
</template

И при использовании компонента:

<template>
   <component imgSrc="./assets/img.png" />
</template

Как импортировать картинку для img в vue?

Войдите на сайт