微信小程序-WXS脚本-个人在线分享

一、概述

1.WXS

WXS(WeiXin Script)是小程序独有的一套脚本语言，结合 WXML，可以构建出页面的结构。

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

二、基础语法

1.内嵌wxs脚本

wxs代码可以编写在wxml文件中的标签内，就像Javascript代码可以编写在html文件中的标签内一样

wxml文件中的每个标签，必须提供module属性，用来指定当前wxs的模块名称，方便在wxml中访问模块中的成员：

2.定义外联的wxs脚本

wxs代码还可以编写在以.wxs为后缀名的文件内，就像javascript代码可以可以编写在以,js为后缀名的文件中一样

新建一个wxs脚本

微信小程序-WXS脚本插图

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

module.exports = {
  toLower: toLower
}

3.使用外联的wxs脚本

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

module用来指定模块的名称

src用来指定要引入的脚本的路径，且必须是相对路径

在.js文件中声明一个country

// pages/message/message.js
Page({

  /**
   * 页面的初始数据
   */ 
  data: {
    country: 'CHINA'
  }
)}

在message.wxml中：




{{country}}



{{m.toLower(country)}}

微信小程序-WXS脚本插图(1)

三、wxs特点

1.不能作为组件的事件回顾

wxs典型的应用场景就是“过滤器”，经常配合Mustache语法进行使用，例如：

{{m.ToLower(country)}}

但是，在wxs中定义的函数不能作为组件的事件回调函数，例如，下面的用法是错误的：

2.隔离性

隔离性指的是wxs的运行环境和其他JavaScript代码是隔离的

（1）wxs不能调用js中定义的函数

（2）wxs不能调用小程序提供的API

3.性能好