组件介绍
gal-number-show 组件以递增动画形式展示一个数值，并提供了灵活的属性和插槽。
兼容平台
组件属性
| 属性名称 | 类型 | 默认值 | 作用 |
| styles | String | ''
| 数值项目样式 |
| number | Number | 900 | 需要展示的数值 |
| step | Number | 30 | 动画展示步数 |
| speed | Number | 50 | 每步间隔时间 |
| direction | String | flex-start | 展示方向 flex-start : 左侧，center : 居中，flex-end 右侧 |
组件插槽
gal-number-show 组件在数值前预置了插槽，可以通过此插槽来放置单位展示元素，详见演示代码；
演示代码
<template>
<view class="gal-body pagebg" style="padding-top:50rpx;">
<text class="gal-block-text gal-h5 gal-color-gray">文本形式</text>
<view class="gal-margin-top">
<gal-number-show
:number="999.99"
:step="33"
styles="font-size:38rpx; line-height:60rpx;">
<view style="font-size:38rpx; line-height:60rpx;">￥</view>
</gal-number-show>
</view>
<view style="height:88rpx;"></view>
<text class="gal-block-text gal-h5 gal-color-gray">样式配置</text>
<view class="gal-margin-top">
<gal-number-show
:number="999"
:step="33"
styles="font-size:36rpx; line-height:40rpx; width:40rpx; padding:10rpx; background:#3688FF; color:#FFFFFF; margin:5rpx; text-align:center; border-radius:8rpx;">
<view style="font-size:36rpx; line-height:40rpx; width:40rpx; padding:10rpx; background:#FF0036; color:#FFFFFF; margin:5rpx; text-align:center; border-radius:8rpx;">$</view>
</gal-number-show>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
</style>
