微信小程序从入坑到放弃二十五:记一次在WXS中使用正则表达式的坑

本文记录了在微信小程序开发中使用WXS遇到的问题,由于接口返回数据包含特殊字符,导致在使用正则表达式时遇到困难。通过学习官方文档,了解到在WXS中生成正则对象需使用getRegExp函数,最终成功优化了formatValue函数,实现了数据的正确格式化。
摘要由CSDN通过智能技术生成

摘要:
WXS(WeiXin Script)是小程序的一套脚本语言,结合 WXML,可以构建出页面的结构。在此次开发中,由于接口返回数据不统一,所以要对某些字段进行过滤。但直接使用replace时竟然报错了,原来在WXS中要生成regexp对象需要使用getRegExp函数…

一、起因

其实不用说看官也能猜到,起因当然是公司的小程序又有了新的需求嘛!此次小程序的需求中有一个是关于 商品组件UI优化 的需求,优化规则如下:

优惠券:金额取整。不超过1元,则不显示;超过9999,则仅显示9999+
商品价格:当商品金额小于10000时,保留2位小数显示;大于等于10000元时,则显示为1.0万的格式,即保留1位小数
已售:当虚拟销小于10000件时,显示完全;当虚拟销量大于等于10000件,则显示为已售1.0万件的格式,即保留1位小数
佣金:当佣金小于10时,保留2位小数显示;大于等于10元时,保留1位有效数字;大于等于100时,保留为整数;大于等于1000时,显示为:赚¥999+

二、方案选择

考虑到现有项目的复杂程度,涉及修改的组件至有三个,分别是: 普通商品秒杀商品拼团商品 。如果在每个组件内的js中修改,肯定是不可取的,毕竟js中会有大量的逻辑运算。最后综合考虑后选择使用 WXS ,即:在创建一个后缀为wxs的文件,在里面封装一个函数,在需要修改的地方调用即可。

三、封装代码

创建组件等步骤这回就不多说了,直接写代码吧,然后再说坑的事情。

3.1、wxs中封装formatValue

核心代码:

/* 封装一个格式转换的方法 */
function formatValue(value, type) {
   
  var result = value
  switch (type) {
   
    case 'price': /* 普通价格 */
      /* 商品价格:当商品金额小于10000时,保留2位小数显示;大于等于10000元时,则显示为1.0万的格式,即保留1位小数 */
      result = Number(value)
      if (result < 10000) {
   
        result = result.toFixed(<
  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值