1.0.5 • Published 3 years ago

zprogress v1.0.5

Weekly downloads
100
License
MIT
Repository
github
Last release
3 years ago

zprogress

npm.io license Build Status npm

虚拟进度条.

:pill: 兼容性

单元测试保证支持如下环境:

IECHFFSFOPIOSAndroidNode
6+29+55+9+50+9+4+4+

注意:编译代码依赖ES5环境,对于ie6-8需要引入es5-shim才可以兼容,可以查看example/demo-global.html中的例子

:open_file_folder: Example

打开 Example/demo-global.html

demo

:rocket: 使用者指南

通过npm下载安装代码

$ npm install --save zprogress

如果你是node环境

var ZProgress = require('zprogress');
var progress = new ZProgress({
    /* Settings */
    onChange(step) {
        console.log('step:', step)
    },
})
progress.start()

如果你是webpack等环境

import ZProgress from 'zprogress';
const progress = new ZProgress({
    /* Settings */
    onChange(step) {
        console.log('step:', step)
    },
})
progress.start()

如果你是requirejs环境

requirejs(['node_modules/zprogress/dist/index.aio.js'], function (ZProgress) {
    var progress = new ZProgress({
        /* Settings */
        onChange(step) {
            console.log('step:', step)
        },
    })
    progress.start()
})

如果你是浏览器环境

<script src="node_modules/zprogress/dist/index.aio.js"></script>

Mehods

描述参数
set设置值
start开始
done结束
pause暂停
stop暂停并重置
reset重置
inc/trickle步进(val?: number)
isStarted是否开始
isPause是否暂停
isDone是否结束了
ZProgress.clamp返回在区间的值(val?: number)

Settings

const settings = {
    /**
     * 开始后是否步进
     * @type { Boolean }
     */
    trickle: true,
    /**
     * 步进频率, 定时器延迟值
     * @type { Number }
     */
    trickleSpeed: 200,
    /**
     * 最小值
     * @type { Number }
     */
    min: 0,
    /**
     * 最大值
     * @type { Number }
     */
    max: 100,
    /**
     * 即将完成的最大值
     * @type { Number }
     */
    // waitMax: .994,
    waitMax: 98,
    /**
     * change事件
     * @type { Function<number> }
     */
    onChage: undefined,
}
1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.2

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago