如何将src从对象获取到我的Vue.js图像

Question

现在我正试图将src从对象获取到我的vue.js组件

export const Quizzes = [
{
firstWord: "happy",
secondWord: "srećan",
imageSrc: "../assets/happy--women.jpg",
},
]

我的data.js文件看起来像这个

以及我如何在Vue.js组件中使用它

<img class="happy-women" src="../assets/earth.jpg" alt="Quiz Image" />

此处而不是src链接

Answer 1

根据我的理解，您只是想在模板中的img元素的src属性中绑定对象imageSrc属性值吗？如果是，开始：

<img v-for="(quiz, index) in Quizzes"
:key="index"
:class="`${quiz.firstWord}-${quiz.secondWord}`"
:src="quiz.imageSrc"
alt="Quiz Image" />