# 给假进度条fake数据的一个类库

* 抖音：<https://v.douyin.com/ACvQY2Y/>
* B站：<https://www.bilibili.com/video/BV1os4y127Jc/>

> **demo预览：**
>
> <https://sunzsh.github.io/vue-demos/#/fake-progress>
>
> **代码：**
>
> <https://github.com/sunzsh/vue-el-demo/blob/master/src/views/fake-progress.vue>

分享一个类库哈，就是这个fake-progress

它可以虚拟一个：一直在增长...

但是永远到不了百分之百的

这么一个进度值

首先呢在项目里安装一下

然后呢

导进来，我这比较简单哈

直接在data里边new了一个

然后呢是自动开始的

然后在页面上呢

我们就可以fake.progress来看了

大家看一下

刷新一下

大家看他就是从 0.xxxxx 开始

但是他永远涨不到

所以呢我们要配合一些UI组件的话

就可以直接把这个值（乘100）绑定到

进度条的组件上

比方说 ElementUI 这个

el-progress我就把这个fake.progress \*

然后注意一定要用parseInt

因为啊如果是99.999999几

这样如果用toFixed的话

就会变成100了

所以大家记着一定要用parseInt

我们再来看一下刷新

大家看它就一直在涨

而且呢它是越来越慢

永远也到不了百分之百

那如果我们的请求已经结束了

需要这时候需要让它完成的话

这时候也很简单

我们就直接在这

比如说写一个按钮来模拟一下啊

button 然后呢 结束

我们调用

这个 fake.end()

我们来试一下

大家看，一直在涨！然后呢我们点下 结束

它就可以了