在微信小程序实际开发应用中，后台接口返回数据里面有时会有数据转换，有时候用循环进行转换比较麻烦，这时我就想到了Vue里面的过滤器，可是小程序没有官方过滤器，这时候可以用 WXS来模拟过滤器。
首先来看一下WXS是什么吧。
WXS（WeiXin Script）是小程序的一套脚本语言，结合 WXML，可以构建出页面结构。
1. wxs 不依赖于运行时的基础库版本，可以在所有版本的小程序中运行。
2. wxs 与 javascript 是不同的语言，有自己的语法，并不和 javascript 一致。
3. wxs 的运行环境和其他 javascript 代码是隔离的，wxs 中不能调用其他 javascript 文件中定义的函数，也不能调用小程序提供的API。
4. wxs 函数不能作为组件的事件回调。
5. 由于运行环境的差异，在 iOS 设备上小程序内的 wxs 会比 javascript 代码快 2 ~ 20 倍。在 android 设备上二者运行效率无差异。
一、直接在页面渲染
1.wxml页面中：
<wxs module="m1">
var msg = "hello world";
module.exports.message = msg;
</wxs>
<view> {{m1.message}} </view>
页面输出：
hello world
二、在wxs文件中导出
1.在utils文件夹里面新增一个filter.wxs文件
// 价格格式化 过滤器的使用
function price(num) {
if (parseFloat(num).toString() == "NaN") {
return 0.00;
} else {
var price = num / 100;
return price.toFixed(2);
}
}
module.exports = {
price: price
}
2.在js的data里面定义list
//data里面
data: {
list: [{
title: '红富士',
money: 1000
},
{
title: '猕猴桃',
money: 1234
},
{
title: '红心柚',
money: 2345
},
]
},
3.在wxml中引入
//引入filter.wxs
<wxs module="filter" src="../utils/filter.wxs" />
<view class='title'> 水果特价：</view>
<view class='item' wx:for="{{list}}" wx:key="index">
<text>{{item.title}}:</text>
<text>{{filter.price(item.money)}} (￥)</text>
</view>
页面输出：
水果特价：
红富士：10.00 (￥)
猕猴桃：12.34 (￥)
红富士：23.45 (￥)
注意:
1.wxs文件不能被js文件引用,能引用wxs文件；
2.wxs 中不能调用 javascript 中定义的函数或者变量，也不能调用小程序提供的API，他的运行环境和 javascript 是隔离的。
4.wxs目前似乎并不支持ES6（至少let不能使用）；
5.只能使用 var 来定义变量，表现形式和 javascript 一样，会有变量提升;
6.不支持使用 new Date()，获取当前日期要用getDate() 。
