二十六次入坑与弃坑：在WXS中使用split实现金额小数点前大于后的数值处理效果

摘要：
本次微信小程序开发项目中涉及对价格显示格式的调整。其中特别关注的是小数点前后的数值差异问题。为了实现这一目标，在前端界面设计时仅需展示一个关键数据项的情况下，默认采用split方法将数据字段分割开来处理，并结合wxss样式进一步优化视觉效果以达到预期展示效果的目的。

大纲

• • 一、原型

  • 二、思路分析

  • 三、split()方法

  • • 3.1、新增split 类型
    • 3.3、细节优化
    • • 3.3.1、方案一：整数时不显示小数

  • 3.3.2、方案二：统一保留两位有效小数

  • 四、demo源码

  • 五、其他说明

一、原型

可能标题描述的不是太清晰，那我们就看下原型图吧。如图：UI原型.png

实际上就是：小数点前的数字比小数点后面的数字大

二、思路分析

在常规情况下，默认情况下，默认情况下（即常规场景下），金额或价格作为一个字段存在。例如，在系统中使用变量名price时，默认情况下默认字符大小统一，则无需担心小数点前后字符大小不一的情况