微信小程序 mpvue 数字更新滚动动画组件 / An an
微信小程序 mpvue 数字更新滚动动画组件。
An animated number component for mpvue (a framework to develop WeChat Mini Program).
Demo微信扫一扫以下小程序码查看真实效果。
Scan the following code with WeChat to see the real-world effects.
$ npm i --save @gaomd/mpvue-animated-number
Usage
Using inside the mpvue SFC, update this.temperatureReading then the number will change accordingly with elegant animation.
// src/pages/home/home.vue <template> <p class="temperature"> <AnimatedNumber :value="temperatureReading" :precision="2" > </AnimatedNumber> </p> </template> <script> import AnimatedNumber from '@gaomd/mpvue-animated-number'; export default { components: { AnimatedNumber, }, data() { return { temperatureReading: 3.14, }; }, } </script> <style> /* optional */ .temperature { line-height: 30px; font-size: 16px; text-align: center; font-weight: bolder; font-family: "Avenir Next Condensed", sans-serif; color: #333; } </style> License
Copyright (c) 2018 Mengdi Gao
Based on MIT Licensed Vue.js documentation.
This software is licensed under the MIT License.
版权声明：
1、该文章(资料)来源于互联网公开信息，我方只是对该内容做点评，所分享的下载地址为原作者公开地址。2、网站不提供资料下载，如需下载请到原作者页面进行下载。
