【非AI】vue组件纯手工打造指标VS对比统计面板vue+css3纯手工打造表报&看板类2类指标对比统计业务场景的组件面

前言

vue+css3纯手工打造表报&看板类2类指标对比统计业务场景的组件面板,如果有碰到类似业务场景可以直接复制代码使用,希望能帮助到JYM们,如果好用记得请点赞支持一下！

在线Demo

组件中引用到了countTo数字自增vue组件

关于countTo的使用

1.Vue项目中使用countTo

首先，需要在Vue项目中安装countTo。可以通过npm（Node Package Manager）来安装。在项目的根目录下打开命令行工具，输入以下命令： npm install vue-count-to --save

2.引入countTo

<script>  
import { defineComponent } from 'vue';  
import CountTo from 'vue-count-to'; // 假设这是正确的包名，并且它是Vue 3兼容的  
  
export default defineComponent({  
  name: 'MyComponent',  
  components: {  
    CountTo,  
  },  
});  
</script>

3.初始化countTo

<template>  
  <div>  
    <CountTo :startVal="0" :endVal="2023" :duration="2000" :decimals="2" />  
  </div>  
</template>