简介

会动的数字。

快速开始

npm i moving-numbers-vue3 -S

快速应用

全局注入

import movingNumbers from 'moving-numbers-vue3'
app.use(movingNumbers);

局部注入

import { MovingNumbers } from 'moving-numbers-vue3';
export default {
  name: 'App',
  components: {
    MovingNumbers
  }
}

主参数

参数 | 类型 | 必填项 | 默认值 | 参考值 | 说明 ---- | ----- | ------ | ------ | ------ | :------ mNum | Number 或 String | √ | | | 会动的数字。 mode | String | × | fast | fast：快增；fix：定变；scroll：滚动； | 计算模式。 decimal | Number | × | | | 小数位限制，默认不做处理。设定后处理原则：数据小数位位数大于指定数字处理。 quantileShow | Boolean | × | false | | 分位符号是否显示。 quantileType | Number | × | 4 | | 分位符号类型：人民币：4位分割；美元：3位分割。 fontSize | Number | × | 14 | | 字体大小。

方法

参数 | 类型| 解释 ---- | ----- | :------

示例 1

<MovingNumbers
  class="c1"
  :mNum="movingNumber"
  :quantileShow="true">
</MovingNumbers>

setInterval(() => {
  this.movingNumber = (Math.random() * 1000000).toFixed(6);
  // console.log(this.movingNumber);
}, 5000);
</script>

示例 2

<MovingNumbers
  class="c2"
  :mNum="movingNumber"
  mode="fix"
  :decimal="3"
  :quantileShow="true"
  :quantileType="3">
</MovingNumbers>

setInterval(() => {
  this.movingNumber = (Math.random() * 1000000).toFixed(6);
  // console.log(this.movingNumber);
}, 5000);
</script>

示例 3

<MovingNumbers
  class="c3"
  :mNum="movingNumber"
  mode="scroll"
  :decimal="4"
  :quantileShow="true">
</MovingNumbers>

setInterval(() => {
  this.movingNumber = (Math.random() * 1000000).toFixed(6);
  // console.log(this.movingNumber);
}, 5000);
</script>