Vue-Countup-v2 使用按钮控制数字滚动动画

Vue-Countup-v2 是一个数字滚动动画库，可以将数字以滚动的方式显示出来。如果要使用按钮控制开始和结束，可以通过以下步骤实现：

1. 安装 vue-countup-v2 库

npm install vue-countup-v2 --save

2. 在 Vue 组件中引入和使用 vue-countup-v2 库

<template>
  <div>
    <div>{{ count }}</div>
    <button @click="startCount">开始计数</button>
    <button @click="stopCount">停止计数</button>
    <countup :endVal="count" :options="options" ref="countup"></countup>
  </div>
</template>

<script>
import CountUp from 'vue-countup-v2'

export default {
  components: {
    CountUp,
  },
  data() {
    return {
      count: 0,
      options: {
        useEasing: true,
        useGrouping: true,
        separator: ',',
        decimal: '.',
      },
    }
  },
  methods: {
    startCount() {
      this.$refs.countup.start()
    },
    stopCount() {
      this.$refs.countup.pauseResume()
    },
  },
}
</script>

在上面的代码中，我们通过 `countup` 组件展示数字，并使用 `options` 属性来配置数字的格式。我们还定义了两个按钮，分别用来开始和停止计数。在方法中，我们通过 `$refs` 属性获取到 `countup` 组件的实例，并调用 `start()` 和 `pauseResume()` 方法来控制计数的开始和停止。

注意：在使用 `$refs` 属性时，需要给 `countup` 组件设置 `ref` 属性，如 `ref="countup"`。