A digital clock simulation build on Vue.
without seconds:
You can also use the digital-number component.
via NPM:
npm install --save digital-clock-vuevia Yarn:
yarn add digital-clock-vueimport DigitalClockVue, { DigitalNumber } from 'digital-clock-vue' export default { components: { DigitalClockVue, DigitalNumber } }| Prop | Type | Desc |
|---|---|---|
color | String | CSS color for digital number and twink. |
showSeconds | Boolean | Determine whether to show seconds, default is false. |
<!-- recommend aspect ratio 4:1 --> <digital-clock-vue color="red" showSeconds style="background: black; width: 400px; height: 100px;" /> <!-- recommend aspect ratio when without seconds 8:3 --> <digital-clock-vue color="#39af78" style="background: #2f4053; width: 240px; height: 90px;" /> <!-- digital number --> <div> <digital-number :key="item" :num="item" color="#1973de" style="width: 45px; height:75px; margin-left: 2px;" v-for="item in Array.apply(null, {length: 10}).map((_, i) => i)" ></digital-number> </div>