小程序中wxs

什么是wxs

wxs（weixin script）是小程序独有的一套脚本语言，结合wxml，可以构建出页面的结构

wxs的应用场景

wxml中无法调用在页面的.js中定义的函数，但是，wxml中可以调用wxs中的函数。因此，小程序中的wxs的典型应用场景就是 “过滤器”

wxs和JavaScript的关系

1. wxs有自己的数据类型
   • number、string、Boolean、Object、function、array、date、regexp
2. wxs不支持类似于ES6及以上的语法
   • 不支持：let、const、解构赋值、展开运算符、箭头函数、对象属性简写等
   • 支持：var定义变量、普通function函数
3. wxs遵循CommonJS规范
   • module对象
   • require() 函数
   • module.exports对象

wxs的基本用法

1. 定义内联的wxs脚本

wxs代码可以编写在wxml文件中的 标签中，就像JavaScript代码可以编写在html文件中的

2. 定义外联的wxs脚本

wxs代码还可以编写在以.wxs为后缀名的文件中，就像JavaScript代码可以编写在以.js为后缀名的文件中一样。示例代码：

// tools.wxs文件
function toLower(str){
 return str.toLowerCase();
}

module.exports = {
 toLower:toLower
}
1
2
3
4
5
6
7
8

外联脚本的使用

在wxml中引入外联的wxs脚本时，必须为标签添加module和src属性，其中：

• module用来指定模块的名称
• src用来指定要引入的脚本的路径，且必须是相对路径

示例代码：

view>{{m2.toLower(country)}}</view>

<wxs src="../../utils/tools.wxs" module="m2">

</wxs>
1
2
3
4
5