在微信小程序开发中,遇到了在WXML页面中需要保存小数点后2位,而且这个数字是通过list的item中的两个或多个值计算出来的,这样的情景不要在js中先计算好数值然后保留2位小数(这种方式需要全部遍历列表,然后计算数值后保存到一个变量中,再更新页面,不优雅)
这样自然会想到,在WXML中使用toFixed来保留2位小数不行吗,答案是不行的,toFixed是JavaScript 中的方法,在WXML中直接使用会编译不过。
微信小程序提供了WXS
WXS
WXS(WeiXin Script)是小程序的一套脚本语言,结合 WXML,可以构建出页面的结构。
WXS 与 JavaScript 是不同的语言,有自己的语法,并不和 JavaScript 一致。
WXS是可以使用toFixed方法的。接下来记一下使用方法
先在utils中创建一个文件numberToFixed.wxs,然后编写封装toFixed的方法,传入需要格式化的值value,以及需要保留的小数点位数num
var numberToFixed = function (value, num) {
return value.toFixed(num)
}
module.exports.numberToFixed = numberToFixed
然后在需要使用的WXML中引入这个文件
<wxs module="filter" src="/utils/numberToFixed.wxs"></wxs>
使用
<label class="pricelab">¥ {{filter.numberToFixed(item.price * item.number,2)}}</label>
效果