前提場(chǎng)景
目前有一個(gè)api 他可以隨機(jī)生成一張圖片,我通過(guò)v-for循環(huán)一個(gè)Array渲染出來(lái)幾個(gè)img 并且都調(diào)用了該接口,但是每個(gè)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加個(gè)query,因?yàn)榻涌诤蠖瞬粫?huì)讀這個(gè)query所以不影響,又因?yàn)橛辛诉@個(gè)query使每個(gè)請(qǐng)求接口都不一樣也就不會(huì)走緩存了文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-810798.html
最后說(shuō)一嘴
有人可能會(huì)使用時(shí)間戳作為這個(gè)query,但是在v-for這個(gè)場(chǎng)景下是不實(shí)用的,因?yàn)関-for循環(huán)出來(lái)的是同一個(gè)時(shí)間戳(我已經(jīng)試驗(yàn)過(guò)了),所以才采用的Math.random()文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-810798.html
到了這里,關(guān)于對(duì)于隨機(jī)生成圖片接口瀏覽器走緩存的問(wèn)題的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!