W3Cschool
恭喜您成為首批注冊用戶
獲得88經(jīng)驗值獎勵
圖片懶加載指令。
import { Lazyload } from 'mint-ui';
Vue.use(Lazyload);
為? img
? 元素添加 ?v-lazy
? 指令,指令的值為圖片的地址。同時需要設(shè)置圖片在加載時的樣式。
<ul>
<li v-for="item in list">
<img v-lazy="item">
</li>
</ul>
image[lazy=loading] {
width: 40px;
height: 300px;
margin: auto;
}
若列表不在 ?window
?上滾動,則需要將被滾動元素的 ?id
? 屬性以修飾符的形式傳遞給? v-lazy
?指令
<div id="container">
<ul>
<li v-for="item in list">
<img v-lazy.container="item">
</li>
</ul>
</div>
Copyright©2021 w3cschool編程獅|閩ICP備15016281號-3|閩公網(wǎng)安備35020302033924號
違法和不良信息舉報電話:173-0602-2364|舉報郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號
聯(lián)系方式:
更多建議: