前提场景
目前有一个api 他可以随机生成一张图片，我通过v-for循环一个Array渲染出来几个img 并且都调用了该接口，但是每个img都是一样的图片
具体代码如下
<div class="icon-group-box" v-for="item in groupList" :key="item.id">
<img :src="`https://api.likepoems.com/img/pc/`" alt="" srcset="">
<span class="icon-group-name">{{ item.name }}</span>
</div>
图片如下所示
解决方法：
<div class="icon-group-box" v-for="item in groupList" :key="item.id">
<img :src="`https://api.likepoems.com/img/pc/?random=${Math.random()}`" alt="" srcset="">
<span class="icon-group-name">{{ item.name }}</span>
</div>
只需要给api加个query，因为接口后端不会读这个query所以不影响，又因为有了这个query使每个请求接口都不一样也就不会走缓存了文章来源：https://www.toymoban.com/news/detail-810798.html
最后说一嘴
有人可能会使用时间戳作为这个query，但是在v-for这个场景下是不实用的，因为v-for循环出来的是同一个时间戳（我已经试验过了），所以才采用的Math.random()文章来源地址https://www.toymoban.com/news/detail-810798.html
到了这里，关于对于随机生成图片接口浏览器走缓存的问题的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
