CountUp.js使用踩坑

        跟着花裤衩大大学习，想封装一个vue 的组件。地址：javascript - 手摸手，带你封装一个vue component_个人文章 - SegmentFault 思否

但是距离时间太久，有不少小坑，跟着作者一模一样也报错，上网查了查资料，发现也没什么人提，只好自己摸索了。首先引入问题。

import CountUp from 'countup.js'

这样引入是不行的，会报错，CountUp 需要加{}，即{CountUp }。

        刷新，然后发现页面一直是0，数字不跳动。以下是原作者的代码。为了查错，去源码看了一下。

methods:{
    initCountUp(){
      this.numAnim = new CountUp(this.$refs.countup,0, 2017)
      this.numAnim.start();
    }
  }

然后发现，传入的参数变了。（target，endVal，options）target：匹配的元素，即在页面显示的元素。endVal：最终页面的显示的数字。options：这里已经传的是一个对象配置，而不是一个数字了。把0改为自己想要的数字就行了。

options: {
          useEasing: true,
          useGrouping: true,
          separator: ',',
          decimal: '.',
          prefix: '',
          suffix: ''
        }