当前位置:网站首页>V-for img SRC rendering fails
V-for img SRC rendering fails
2022-07-07 11:08:00 【Have a good time I】
Problem description :
An array is defined , The path with pictures in the array , Use for When the page is rendered in a loop , The picture path is right, but the picture does not show .
terms of settlement : The path of the image in the array should be written as follows :
image:require('../assets/img/login.png')
Write when rendering
<img :src="item.image" />
Specific examples
<a-menu
v-for="(v, i) in navData"
:key="i"
:default-selected-keys="['/account/home']"
:selected-keys="[v.key]"
mode="inline"
type="inner"
class="accout_menu"
@openChange="onOpenChange"
>
<a-menu-item key="v.key">
<router-link :to="{ name: v.name }">
<img :src="v.src" class="menu_account_image" />
<span class="menu_account_title">{
{
v.title }}</span>
</router-link>
</a-menu-item>
</a-menu>
data() {
return{
navData: [
{
key: '/account/home', name: 'account/home', src: require('@/assets/image/account/home.png'), title: ' home page ' },
{
key: '/account/consumptive-volume',
name: 'account/consumptiveVolume',
src: require('@/assets/image/account/consumptiveVolume.png'),
title: ' Card and voucher management '
},
{
key: '/account/order',
name: 'account/order',
src: require('@/assets/image/account/order.png'),
title: ' Order management '
},
{
key: '/account/bill',
name: 'account/bill',
src: require('@/assets/image/account/bill.png'),
title: ' Transaction records '
},
{
key: '/account/community',
name: 'account/community',
src: require('@/assets/image/account/community.png'),
title: ' My circle '
},
{
key: '/account/message',
name: 'account/message',
src: require('@/assets/image/account/message.png'),
title: ' Message center '
},
{
key: '/account/base-setting',
name: 'account/baseSetting',
src: require('@/assets/image/account/baseSetting.png'),
title: ' Account Center '
}
]
}
}
```
边栏推荐
- After the uniapp jumps to the page in onlaunch, click the event failure solution
- Those confusing concepts (3): function and class
- Installation and configuration of slurm resource management and job scheduling system
- Some online academic report websites and machine learning videos
- The gun startles the dragon, and the crowd "locks" Zhou Zhi
- Shardingsphere sub database and table examples (logical table, real table, binding table, broadcast table, single table)
- What does intermediate software evaluator test
- shardingsphere分库分表示例(逻辑表,真实表,绑定表,广播表,单表)
- The fifth training assignment
- 【亲测可行】error while loading shared libraries的解决方案
猜你喜欢
![[untitled]](/img/15/3db921703147afdf58dfffe532a19b.jpg)
[untitled]

China Southern Airlines pa3.1

SQL Server knowledge gathering 9: modifying data

Deeply understand the characteristics of database transaction isolation

香橙派OrangePi 4 LTS开发板通过Mini PCIE连接SATA硬盘的操作方法

從色情直播到直播電商

seata 1.3.0 四种模式解决分布式事务(AT、TCC、SAGA、XA)

Arduino board description

The concept, implementation and analysis of binary search tree (BST)
![[système recommandé 01] rechub](/img/92/c14c867247d3a042c69b5ed0091fbe.png)
[système recommandé 01] rechub
随机推荐
[untitled]
书签整理-程序员常用网站导航
Vscode 尝试在目标目录创建文件时发生一个错误:拒绝访问【已解决】
Records on the use of easyflash v3.3
Bookmarking - common website navigation for programmers
Deeply understand the characteristics of database transaction isolation
uniapp 在onLaunch中跳转页面后,点击事件失效解决方法
【推薦系統 01】Rechub
Deep understanding of Apache Hudi asynchronous indexing mechanism
Unity websocket server
Using tansformer to segment three-dimensional abdominal multiple organs -- actual battle of unetr
When do you usually get grades in the soft exam? Online pedaling?
What are the contents of the intermediate soft test, the software designer test, and the test outline?
When initializing 'float', what is the difference between converting to 'float' and adding 'f' as a suffix?
[machine learning 03] Lagrange multiplier method
Is the soft test intermediate useful??
【STM32】实战3.1—用STM32与TB6600驱动器驱动42步进电机(一)
"Dream Cup" 2017 Jiangsu information and future primary school summer camp it expert PK program design questions
Go Slice 比较
Deep understanding of Apache Hudi asynchronous indexing mechanism