欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Vue中img的src结合vfor的拼串问题

程序员文章站 2024-01-02 21:24:52
...

Vue中img的src,结合vfor的拼串问题

问题概述: Vue中从后台拿到的图片url需要添加后缀来获取不同尺寸的图片,img中src需要动态获取,记录一下,希望能帮助到像我一样学习的新手

  • 解决方法1: es6模板字符串嵌套,简单明了
<img :src='`${item.al.picUrl}?param=50y50`' alt="">
  • 解决方法2: 采用vue过滤器去实现

这是过滤器

//定义一个imgUrl过滤器
Vue.filter('imgfilter', input=>{
  return input + '?param=50y50'
})

这是img用法

<img :src="item.coverImgUrl | imgfilter" @load="bs.refresh()" />

上一篇:

下一篇: