# vue-loading **Repository Path**: lydxwj/vue-loading ## Basic Information - **Project Name**: vue-loading - **Description**: loading页面 - **Primary Language**: JavaScript - **License**: MIT - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 1 - **Forks**: 0 - **Created**: 2020-07-13 - **Last Updated**: 2021-05-18 ## Categories & Tags **Categories**: vue-extensions **Tags**: None ## README # vue-loading 加载页 #### 安装 ``` npm install @lydxwj/vue-loading --save ``` #### 使用 ``` import Loading from '@lydxwj/vue-loading'; Vue.use(Loading); export default { name: 'app', data () { return { number: 0, srcList: [ 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1559738559098&di=c8c212941da82e85fdc49f06272da023&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F32fa828ba61ea8d3fcd2e9ce9e0a304e241f5803.jpg', 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1559738559098&di=fcfa50a3fed4b01438ac9d93ee644039&imgtype=0&src=http%3A%2F%2Fe.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F4610b912c8fcc3cef70d70409845d688d53f20f7.jpg', ], }; } }; ``` #### 属性 - srcList 资源数组 静态资源需要使用require处理 支持格式`.png .jpg .jpeg .gif`, `.css`,`.js` - time 自定义时间,毫秒,定义时间时不会等待资源加载完 #### 方法 - percent百分比更新回调 参数percent:当前百分数0~100 - complete完成回调,加载完或者加载失败或者加载时间结束等情况下执行 参数res:加载过的资源对象 - fail失败回调 参数e:失败对象,src:失败的资源地址,idx:当前失败是第几项 **属性和方法都是可选的**