vue-countup-v2在vue2项目怎么安装引入
时间: 2023-08-15 10:04:56 浏览: 161
在 Vue2 项目中,可以使用 `npm` 或 `yarn` 安装 `vue-countup-v2` 组件。
使用 `npm` 安装:
```
npm install vue-countup-v2 --save
```
使用 `yarn` 安装:
```
yarn add vue-countup-v2
```
然后,在需要使用 `vue-countup-v2` 组件的 Vue 组件中,可以使用以下方式引入:
```javascript
import VueCountup from 'vue-countup-v2';
export default {
components: {
VueCountup,
},
// ...
}
```
接下来就可以在模板中使用 `vue-countup-v2` 组件了:
```html
<vue-countup :start-val="0" :end-val="100"></vue-countup>
```
注意:`vue-countup-v2` 组件依赖于 `CountUp.js` 库,因此需要在项目中引入该库。可以在 `index.html` 文件中通过 `script` 标签引入,或者使用模块化方式引入。例如,在 `main.js` 中通过 `import` 引入:
```javascript
import CountUp from 'countup.js';
Vue.component('vue-countup', VueCountup);
Vue.prototype.$countUp = CountUp;
```
这样就可以在整个项目中使用 `CountUp` 类,并且可以通过 `this.$countUp` 来访问。
阅读全文