我希望使用v-bind:src动态渲染一个带有v-for图像src的v-vor图像。尽管图像目录似乎是正确的(但我如何检查呢?)并且其他数组键被显示,但我在模板中看不到图标。
structure: src
- assets // 图像内部
-components // 组件内部
<q-card v-for="benefit in benefits" :key="benefit.title">
<img class="benefits__item-icon" :src="benefit.icon" :alt="benefit.alt">
<q-card-section >
<div>{{benefit.content}}</div>
</q-card-section>
</q-card>
data() {
return {
benefits: [
{
icon: '../assets/benefits-icon.svg', //不显示
alt: 'benefits', //正常显示
title: 'plain text', //正常显示
content: 'plain text' //正常显示
},
]
}
}
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
尝试更改此代码
1. <img class="benefits__item-icon" :src="require(benefit.icon)" :alt="benefit.alt">