vue3视频图片懒加载

将在用户规定区域内懒加载图片视频，并且图片将有相对应的加载占位图和错误占位图，8kb轻量级框架

配置项：

loading：图片加载时的占位图url地址  String
error：图片加载失败占位图url地址 String
payload：加载响应区域，默认为1.3，即为整个窗口加上百分之30 Number

案例:

main.js:{
	import createLazyLoad from "v3-lazyload-hyw";

    const app =  createApp(App)

    const lazyOption = {
        //...
        loading:'',
        error:'',
        payload:1.3
    }
    app.directive('lazyload',createLazyLoad(lazyOption))
}

图片懒加载：<img v-lazyload='图片路径' />
视频懒加载：<video v-lazyload='视频路径' controls>

自定义事件捕捉状态：
<img
	controls
	v-lazyload="item.src" 
	@lazyError="console.log('error!')"
	@lazyLoading="console.log('loading!')"
	@lazySuccess="console.log('success!')"
/>

在模板中使用console：
vue2：
data(){
	return{
		console:console
	}
}

vue3:
setup(){
	return{
		console,
	}
}

版本

v1.5.6

修复vue响应式导致的问题

此包将持续维护和更新，如有需求，bug，交流，源码等请加vx：chibawangc