Vue.js 数字动画组件 Vue-Countup-V2：按钮控制开始和停止

Vue-Countup-V2 组件是一个数字动画组件，可以通过按钮控制开始和停止动画。

首先，在 Vue 组件中，需要定义一个状态变量来控制动画的开始和停止，例如：

data() {
  return {
    startAnimation: false
  }
}

然后，在模板中使用 vue-countup-v2 组件，并绑定该状态变量到'start'属性上，例如：

<vue-countup-v2 :start='startAnimation' :end='1000' :duration='2'></vue-countup-v2>

这样，当'startAnimation'的值为'true'时，动画将开始播放；当'startAnimation'的值为'false'时，动画将停止。

最后，在模板中添加按钮，并绑定'click'事件来改变'startAnimation'的值，例如：

<button @click='startAnimation = !startAnimation'>开始/停止动画</button>

这样，每次点击按钮时，'startAnimation'的值将取反，从而控制动画的开始和停止。完整的代码示例如下：

<template>
  <div>
    <vue-countup-v2 :start='startAnimation' :end='1000' :duration='2'></vue-countup-v2>
    <button @click='startAnimation = !startAnimation'>开始/停止动画</button>
  </div>
</template>

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

export default {
  components: {
    VueCountupV2
  },
  data() {
    return {
      startAnimation: false
    }
  }
}
</script>