Компонент Vue.js img src из опоры?
Я пытаюсь сделать следующее, но изображение выводится некорректно. Когда я показываю изображение в display.vue, если я печатаю {{someText}}, я получаю правильный путь к файлу (../assets/city.png).
display.vue
<template>
<example :someText = "'../assets/' + stamp + '.png'"></example>
</template>
<script>
import example from './example.vue'
export default {
name: "",
data() {
return {
stamp: "city"
}
}
components: [
example
]
};
</script>
example.vue
<template>
<img :src = "someText" />
</template>
<script>
export default {
name: "example",
props: ["someText"]
};
</script>
@Stephen Thomas Показывает символ изображения по умолчанию.
Вы проверили, существует ли файл в указанном месте? помните, что относительные URL-адреса (например, тот, который вы используете) относятся к текущему местоположению URL-адреса браузера
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Вам необходимо изменить формат корпуса реквизита:
HTML attribute names are case-insensitive, so browsers will interpret any uppercase characters as lowercase. That means when you’re using in-DOM templates, camelCased prop names need to use their kebab-cased (hyphen-delimited) equivalents (source)
Это должно работать так:
<template>
<example :some-text = "'../assets/' + stamp + '.png'"></example>
</template>
OP не использует шаблоны в DOM, поэтому проблема не в camelCase.
Такое случилось и со мной. В вашем example.vue попробуйте это
<template>
<img src = "../assets/city.png" />
</template>
Если это не дает вам правильный результат. Затем попробуйте с полным путем
<template>
<img src = "src/assets/city.png" />
</template>
В моем случае изображение не читается с ../assets/city.png, но читается с src/assets/city.png.
Может я не знаю. То, что я сказал, сработало для меня. знак равно
Хорошо)). В моем проекте рабочий код <img src = "@ / assets / logo.png" />
Я думаю, что разные версии веб-пакетов должны иметь разный синтаксис. В любом случае мы оба можем сказать, что изменение пути, как вы упомянули, или как я уже упоминал, должно решить этот вопрос. знак равно
Что вы имеете в виду под «некорректно выводится»? Изображение вообще отображается?