Vue.js中对数字进行动画处理 – animated-number-vue

Vue.js中对数字进行动画处理 – animated-number-vue

插件名称:animated-number-vue

发布时间:2020年9月9日

插件作者:Leocardoso94

官网 演示 GitHub下载

使用anime为Vue2提供的简单vue动画编号  。

安装和下载:

# Yarn
$ yarn add animated-number-vue
# NPM
$ npm install animated-number-vue --save

用法

<template>
<animated-number
:value="value"
:formatValue="formatToPrice"
:duration="300"
/>
</template>
<script>
import AnimatedNumber from "animated-number-vue";
export default {
components: {
AnimatedNumber
},
data() {
return {
value: 1000
};
},
methods: {
formatToPrice(value) {
return `R$ ${value.toFixed(2)}`;
}
}
};
</script>
相关插件