小程序学习：WXS

官方文档
WXS（WeiXin Script）是小程序的一套脚本语言，结合 WXML，可以构建出页面的结构。
即WXS可以实现在WXML里写js代码或调用js代码。

WXS 与 JavaScript 是不同的语言，有自己的语法，并不和 JavaScript 一致。
WXS里各种数据类型的方法的使用参照ES5标准。

类比JS，既可以把JS代码写在HTML里，也可以写在单独的JS文件里。
WXS也是既可以把代码写在WXML里，也可以写在单独的WXS文件里。

1、定义WXS

比如定义一个filter.wxs，用来把一段文本的"//n"替换成"/n"：
filter.wxs：

var format = function(text){
    if(!text){
        return
    }
    var reg = getRegExp('\\\\n','g')
    return text.replace(reg, '\n     ')
}

var limit = function(array, length){
    return array.slice(0, length)
}

module.exports = {
    format:format,
    limit:limit
}

注意：WSS与JS不是一回事，因此也不能用ES6里的const，只能用var；这里的模块也与ES6中的模块不同。

2、使用WXS

页面的WXML中导入并使用WXS：

<wxs src="../../util/filter.wxs" module="util" />

<text class="content" decode="{{true}}">{{util.format(book.summary)}}</text>

注意：src只能写相对路径
**decode="{{true}}"**是为了能解析空格 &nbsp

3、WXS里的正则表达式

上述例子中实现了一个正则表达式的应用。在WXS里有专门关于正则表达式的说明：
regexp是WXS的一个数据类型。生成 regexp 对象需要使用 getRegExp函数。

getRegExp(pattern[, flags])
参数：

• pattern: 正则表达式的内容。
• flags：修饰符。该字段只能包含以下字符:
  g: global（全体字符）
  i: ignoreCase
  m: multiline。

4、在WXML文件中写WXS代码

在页面WXML中：

<!-- 使用WXS -->
<v-tag bind:tapping="onPost" tag-class="{{tool.highlight(index)}}" text="{{item.content}}">

<!-- 定义WXS -->
<wxs module="tool">
    var highlight = function(index){
        if(index==0){
            return 'ex-tag1'
        }
        if(index==1){
            return 'ex-tag2'
        }
        return ''
    }

    module.exports = {
        highlight:highlight
    }
</wxs>