1.0.2 • Published 6 years ago

led-number v1.0.2

Weekly downloads
3
License
MIT
Repository
github
Last release
6 years ago

led-number

A Vue digital display component that simulates an LCD dot matrix display.

The name of font used in this component is 'Let's go Digital Regular'.

npm.io

How to use / 如何使用

Install / 安装

npm install led-number
// or install from github reponsitory
npm install https://github.com/ferrinweb/led-number.git

// or use yarn / 推荐使用 yarn
yarn add led-number
// or install from github reponsitory
yarn add https://github.com/ferrinweb/led-number.git

Import / 引入

// global import / 全局引入
import LedNumber from 'led-number'
Vue.use(LedNumber)

// import on demand in your vue component file. / 按需引入
import LedNumber from 'led-number'
export default {
  components: {
    LedNumber
  },
  ...
}

Use and demo / 使用及示例

You can ckeckout this repository and try this demo.

你可以直接检出 led-number 源码到本地,查看示例。

<template>
  <div id="app">
    <led-number class="price" :value="number" :toFixed="2" :toLocale="true"></led-number>
  </div>
</template>

<script>
import LedNumber from './lib/led-number'

export default {
  name: 'App',
  components: {
    LedNumber
  },
  data () {
    return {
      number: 3100
    }
  }
}
</script>

<style>
  /* demo page styles, just ignore these */
  html, body, #app {
    margin: 0;
    width: 100%;
    height: 100%;
  }
  #app {
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
</style>

Attributes / 属性

名称说明默认值
valuenumber to show
toFixednumber of decimal digits2
toLocaleif format the number using the toLocaleString methodfalse

Lisence

MIT Lisence.