WXS模块
WXS(weixin script)是微信小程序内一套脚本语言。本质上来讲wxs提供一个机制,允许我们去定义wxs文件,来在wxml文件中去使用wxs文件中定义的函数,可以将其看作是vue中的过滤器。在使用wxs模块的时候有以下几个注意点:
- wxs模块文件,其扩展名是
.wxs
- wxs模块文件的代码写法与js类似,but:
- 不支持es6写法
- 箭头函数
- let、const
- class
- 对象简写
- …
- wxs模块的语法支持部分的js语法
- wxs模块起到的是辅助的作用,一般在写的时候可以写在
utils
目录下
例如:定义wxs模块,将字符串转小写,并且截取子串
// 该文件模块起到了类似于vue的过滤器的作用,所以其中存放的都是一些处理程序方法,因此在这里写function即可,记得最后导出 function handlerChars(chars, length) { // 如果在函数内需要定义变量,则请用var,不能使用const和let // var a = 11; // 将字符串转小写,并且截取子串 return chars.toLowerCase().slice(0, length) } // ... 如果有更多的方法需求,接着定义即可 // 切记,记得导出 module.exports = { // 不能使用es6的简化写法,必须:“属性名:属性值” handlerChars:handlerChars }
在wxml中去使用wxs模块提供的方法:
<!--pages/wxs/wxs.wxml--> <text>pages/wxs/wxs.wxml</text> <!-- 在使用wxs模块的时候需要导入wxs的,后面的引入相当于是导入,导入的是一个对象,可以通过module属性进行命名 --> <wxs src="/utils/functions.wxs" module="tools"/> <view> {{tools.handlerChars(str,10)}} </view>