vue 数字动起来

最新推荐文章于 2023-09-22 10:13:27 发布

余生庆余年

最新推荐文章于 2023-09-22 10:13:27 发布

阅读量146

点赞数

分类专栏： vue 文章标签： vue.js

本文链接：https://blog.csdn.net/cm18503014324/article/details/115477475

版权

vue 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

这篇博客介绍了如何在Vue中创建一个数字动态展示的效果，通过使用`vue-count-to`组件，设置`endVal`和`duration`等属性，实现数字从0平滑过渡到指定值的动画效果，适用于数据统计或进度展示场景。

摘要由CSDN通过智能技术生成

@vue 数字动态效果

效果应用做个笔记下面是直接上代码`.

// An highlighted block
<template>
  <div>
    <countTo  :endVal='endVal' :duration='2000' style="font-size: 32px;color: #112c78;font-family: 'impact_mt_stdregular';"></countTo>
  </div>
</template>
<script> 
import countTo from 'vue-count-to';
export default {
  components: { countTo },
  data () {
    return {
      endVal: 3025
    };
  }
}
 
</script>