Vue3中v-for循环动态设置img的src属性无法找到图片问题
- useImage.js
// 获取assets静态图片
export const getAssetsImge = name => {
return new URL(`../assets/images/app_img/${name}`, import.meta.url).href;
};
- 使用
tabs = [
{
link: undefined,
pathName: 'MicroCoop', // 直接使用图片名称作为 getAssetsImge的入参
path: '/manage/microCoop',
count: 0,
thumbnail: iconAppmarket,
},
]
// 核心代码
<div class="card-container" v-for="(app, index) in appData" :key="index">
<img class="fuxi-img"
:src="getAssetsImge(app.imgUrl)"
@click="blankNewPage(app.name)"
alt="">
<span class="title-name-1">{{app.name}}</span>
</div>
学而不思则罔,思而不学则殆!