021WXS脚本-概述

什么是wxs

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

wxs的应用场景

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

wxs和javaScript的关系

wxs脚本-基础语法

内嵌wxs脚本

wxs代码可以编写在wxml文件中的<wxs>标签内，
就像Javascript代码可以编写在html文件中的<script>标签内一样。
wxml文件中的每个<wxs></wxs>标签，
必须提供module属性，
用来指定当前wxs的模块名称，
方便再wxml中访问模块中的成员：

view>{{username}}</view>
<view>{{m1.toUpper(username)}}</view>


<wxs module="m1">
  module.exports.toUpper = function(str){
    return str.toUpperCase()
  }
</wxs>

定义外联的wxs脚本

wxs代码还可以编写再以.wxs为后缀名的文件内，
就像javascript代码可以编写再以.js为后缀名的文件中一样。
示例代码如下：
命名一个wxs文件tools.wxs

function toLower(str) {
  return str.toLowerCase()
}

module.exports = {
  toLower:toLower
}

使用外联的wxs脚本

在wxml中引入外联的wxs脚本时，
必须为<wxs>标签添加module和src属性，
其中:
module用来指定模块的名称
src用来指定要引入的脚本路径，且必须时相对路径

引入外联的tools.wx脚本，并命名为m2

  data: {
    count: 0,
    username:'zs',
    country:'CHINA'
  },

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

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