微信小程序 wxs脚本

wxs概述:

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

wxs的注意点:

1. 没有兼容性,wxs不依赖于运行时的基础库版本,可以在所有版本的小程序中运行。

2. 与JavaScript 不同, wxs与JavaScript是不同的语言,有自己的语法,并不和javasc一致。

3. 隔离性,wxs的运行环境和其他JavaScript代码时隔离的,wxs中不能调用JavaScript文件中定义的函数,也不能调用小程序提供的API。

4. 不能作为事件回调,wxs函数不能作为组件的事件回调。

5. wxs 在 IOS设备比JavaScript运行快: 由于运行环境的差异,在IOS设备上小程序内的wxs会比JavaScript代码快 2~20倍。在android设备上运行效率无差异。

wxs遵循CommonJS 模块化规范:

CommonJS是JavaScript的模块规范之一,小程序的脚本语言wxs遵循了CommonJS规范,因此,使用wxs的体验和使用node.js 的体验比较相似。

在wxs中,可以使用CommonJS中规定的如下成员:

module对象: 每个wxs都是独立的模块,每个模块有一个内置的module对象,每个模块都有自己独立的作用域。

module.exports: 由于wxs拥有独立作用域,所以在一个模块里面定义的变量与函数,默认为私有的,对其他模块不可见,通过module.exports 属性,可以对外共享本模块的私有变量与函数。

require函数: 在wxs 模块中引用wxs文件模块,可以使用require函数。

wxs基础语法:

1.使用module.exports 向外共享成员。

2.使用require 引入其他wxs模块。

3. 使用require 的注意点: 

只能应用.wxs 文件模块,且必须使用相对路径。

wxs模块均为单例,wxs模块在第一次被引用时,会自动出事话单例对象,多个页面,多个地方,多次引用,使用的都是同一个wxs模块对象。

如果wxs模块在定义之后,一直没有被引用,则该模块不会被解析与运行。

4.支持的数据类型:

wxs语言目前有以下8种数据类型:

number 数值类型, string 字符串类型, boolean 布尔类型, object 对象类型,function 函数类型, array 数组类型, data 日期类型, regexp 正则


内嵌wxs脚本:

wxs代码剋编写在wxml文件中,<wxs></wxs>标签内,就像JavaScript代码可以编写在html文件中的<script></script>标签内一样。

wxml文件中的每个<wxs></wxs>标签,必须提供一个module属性,用来指定当前<wxs></wxs>标签的模块名。在单个wxml文件内,建议其值唯一。

<!-- wxml -->

<wxs module="foo">
var msg = "hello word"
module.exports = {
    msg
}
</wxs>

<view>{{foo.msg}}</view>

外联wxs脚本:

wxs代码可以编写在以.wxs为后缀的问价内,就像js一样可以编写在.js文件中一样。

//  pages/home/tools.wxs

var foo = "hello word"
var bar = function () {
    console.log(foo)
}

module.exports = {
    foo:foo,
    bar: bar  
}

module.exports.msg = "abc123"

在wxml中引入外联的wxs脚本:

在wxml中引入外联wxs脚本,必须要为<wxs></wxs> 标签添加 module 和src属性。,s r c必须是相对路径

// pages/index/index.wxml

<wxs src="../tools.wxs" module = "tools" />
原文地址:https://www.cnblogs.com/liea/p/11802190.html