uni-app項目數字滾動
插件預覽圖
使用教程
1.插件代碼拷貝
- 下載後把components目錄下countUp.vue文件拷貝到自己項目目錄下
2.插件全局配置
- 在項目裏main.js中配置如下代碼
import countUp from './components/countUp.vue'
Vue.component('countup',countUp)
3.插件使用
- vue頁面使用
<template>
<view>
<countup :num="num" color="#ff9e50" width='13' height='23' fontSize='23'></countup>
<button @tap="add">Add</button>
<button @tap="reduce">Reduce</button>
</view>
</template>
<script>
export default {
data() {
return {
num:123.453
};
},
onLoad() {},
methods: {
add() {
this.num=++this.num;
},
reduce(){
this.num=--this.num;
}
}
};
</script>
兼容性
uni-app項目中使用都兼容