博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Vue如何循环渲染图片
阅读量:4464 次
发布时间:2019-06-08

本文共 505 字,大约阅读时间需要 1 分钟。

Vue如何把服务器返回的图片数据渲染出来

  • 首先,一般来说,当请求图片的接口时,会返回一个数组,这个数组里会是一些图片的名字,比如1.jpg,2.jpg。
  • 我的做法是先在data里定义一个数组,来存储服务器返回的图片名
urlName: [        '这里面放服务器返回的图片名数据'      ],
  • 图片地址的构成是http地址+图片名,比如
https://i0.hdslb.com/bfs/activity-plat/static/20190404/f21c9a9573c71006d7898b5740803822/r1C1JNXFN.png@125w_160h.webp
  • 由于是一个图库的功能,所以用了for循环。这里要注意的是拼接src的地址,如果不用变量存起来,就只有原本的第一个li有这个地址,后面循环出的则只有图片名。
  • 这里进行拼接
  • 以上就完成了对图片的循环渲染啦!

转载于:https://www.cnblogs.com/zly430/p/10756496.html

你可能感兴趣的文章
integer promotion
查看>>
怎么处理系统蓝屏后提示代码0x000000d1的错误?
查看>>
技术分享:如何在PowerShell脚本中嵌入EXE文件
查看>>
浅析C#中的Attribute
查看>>
【转载】String和StringBuffer的区别,以及StringBuffer的常用方法介绍
查看>>
mysql tp5 find_in_set写法
查看>>
SQL练习之求解填字游戏
查看>>
2017年11月15日
查看>>
codeforces 949B A Leapfrog in the Array
查看>>
类似懒加载的js功能
查看>>
Mysql的DATE_FORMAT()日期格式转换
查看>>
vue实战教程
查看>>
shiro(三),使用第三方jdbcRealm连接数据库操作
查看>>
夜神模拟器
查看>>
SparkStreaming入门及例子
查看>>
Web应用增加struts2支持
查看>>
java程序——凯撒加密
查看>>
面试题:比较两个数字大小
查看>>
Linux命令:pgrep
查看>>
大数据应用期末总评
查看>>