![6401e5c5d49efcc5e668a0c45ea6ddb4.png](https://i-blog.csdnimg.cn/blog_migrate/b9d0cbc1e4b58d5911eec8e8b608eaf7.jpeg)
大屏可视化很多情况都涉及到「数字滚动」效果,显得高端又大气,做起监控来也是逼格满满。
今天 F2E 君就来推荐四款「数字滚动」插件,赶快收藏起来吧~
![d865bbf4a0e3fdd9ed6202c105cd2c63.png](https://i-blog.csdnimg.cn/blog_migrate/389fedbc328acb912fa480d5a1e927a4.jpeg)
一、先睹为快
我们以一个「在线教育」上课人数实时监控来举例:
![a85c4ff53040599787da3b1eac9edca2.gif](https://i-blog.csdnimg.cn/blog_migrate/809cd1d28e2ef964014fd2295880c5b9.gif)
当然,你也可以玩出花样来,借助 CSS 的渐变效果,我们可以实现:
![f65024d0d4fa70cd47ea26c855b94454.png](https://i-blog.csdnimg.cn/blog_migrate/f05bb024d03e330c59201ca49925c9b9.jpeg)
怎么样,看起来不错吧。赶快来看看有哪些酷炫的插件吧!
二、CountTo 插件
地址:⭐️⭐️⭐️⭐️⭐️
https://www.npmjs.com/package/vue-count-to
![e1bf73ef52a94dbbc2428c5cdf8bb281.gif](https://i-blog.csdnimg.cn/blog_migrate/793369a77f94babf03f2b7d843319242.gif)
三、翻牌效果
地址:⭐️⭐️⭐️
https://www.jb51.net/article/175367.htm
![e54a74a97b89e856d65f8a96c4681c20.gif](https://i-blog.csdnimg.cn/blog_migrate/5b42282be96a29bae22490321ba18d9c.gif)
四、Number Animation 插件
地址:⭐️⭐️⭐️⭐️⭐️
https://www.npmjs.com/package/vue-number-animation
![9fb078833055b3d376a4064c75a630f7.gif](https://i-blog.csdnimg.cn/blog_migrate/fc4e2c05e166ca3ff70782281e6e5308.gif)
五、Animated Number 插件
地址:⭐️⭐️⭐️⭐️
https://www.npmjs.com/package/animated-number-vue
![c95a131e23402c290f07e9c24d56cc94.gif](https://i-blog.csdnimg.cn/blog_migrate/07c49a4cf529a689ee3de51585430fa9.gif)
六、使用介绍
![0810bf33b1f39d29cbaa88cc2f59a93b.png](https://i-blog.csdnimg.cn/blog_migrate/eb498c4d3370f609d908702217375b84.jpeg)
上面推荐了四款插件,使用也是非常简单的,我们以 Count-To 举例来说明:
1.安装插件
npm install vue-count-to
2.写模版
![b8d72a6ff59e08aa80dcff2868451a8d.png](https://i-blog.csdnimg.cn/blog_migrate/37ec74d453342befc4c85b2aca838172.jpeg)
3.调用
![a6d203603783491d13bc045c47f4bb2e.png](https://i-blog.csdnimg.cn/blog_migrate/44f04ed439572828edca7b1f0b392088.jpeg)
好了,大功告成,使用就是如此简单。
七、热门原创文章推荐
系统负载看不懂?
10 分钟轻松搞定 Web 在线文档
成为优秀技术型领导的 16 条黄金法则
![96cc8e458b1856b94222b5901b094b66.png](https://i-blog.csdnimg.cn/blog_migrate/acb3442d595de200849996d531f6fdbd.jpeg)
在我年轻的时候,曾以为金钱是世界上最重要的东西。现在我老了,才知道的确如此。