图片img标签 src拼接路径问题

最新推荐文章于 2023-09-01 10:37:47 发布

你的美，让我痴迷

最新推荐文章于 2023-09-01 10:37:47 发布

阅读量3.8k

点赞数 2

分类专栏：图片文章标签： mui vue.js

本文链接：https://blog.csdn.net/weixin_45932157/article/details/112712809

版权

这篇博客介绍了如何在Vue中使用`v-for`指令遍历数组并展示数据，特别是处理图片路径的拼接。通过在Vue实例的`data`中设置`url`为全局变量`window.fileUrl`，然后在模板中将`url`与`item.peoplePic`结合，成功地显示了人员图片。同时，文章展示了如何点击元素跳转到详细页面。

摘要由CSDN通过智能技术生成

刚接触vue,v-for中获取字段都很正常，但是中的路径不知道怎么拼接。还是我张哥出马，一个赶俩。废话少说直接上代码。

在vm实例中的data加上url:window.fileUrl,获取路径，然后在拼接。

vue

<div class="people_up block_hover" v-for="(item,index) in peopleArr" :key='item.rowId' @click="Lclick(item.rowGuid)">
                                <div class="picture"><img :src="url+item.peoplePic"></div>
                                <div class="name" id="f_people">{
   {
   item