再说vue3的图片懒加载之前,我在vue2项目中一直用的vue-lazyload插件,现在vue3项目中,发现不再友好支持了,仍然感谢。
安装命令
npm install vue3-lazy -S
//或者
yarn add vue3-lazy
maints文件中use
import App from './App.vue'
import lazyPlugin from 'vue3-lazy'
createApp(App)
.use(lazyPlugin, {
loading: ('loading.png'), // 图片加载时默认图片
error: ('error.png')// 图片加载失败时默认图片
})
.mount('#app')
模板中使用
<ul>
<li v-for="img in list">
<img v-lazy="img.src" >
</li>
</ul>