258资源分享网

注意（来自官方文档） wxs 不依赖于运行时的基础库版本，可以在所有版本的小程序中运行。 wxs 与 javascript 是不同的语言，有自己的语法，并不和 javascript 一致。 wxs 的运行环境和其他 javascript 代码是隔离 ...

 

 

 

 

注意（来自官方文档）

wxs 不依赖于运行时的基础库版本，可以在所有版本的小程序中运行。

wxs 与 javascript 是不同的语言，有自己的语法，并不和 javascript 一致。

wxs 的运行环境和其他 javascript 代码是隔离的，wxs 中不能调用其他 javascript 文件中定义的函数，也不能调用小程序提供的API。

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

由于运行环境的差异，在 iOS 设备上小程序内的 wxs 会比 javascript 代码快 2 ~ 20 倍。在 android 设备上二者运行效率无差异。

举个例子，在wxs出来之前，如果我们要连接一个数组的内容并显示在wxml中，我们需要通过循环连接数组的每一项：  

.wxml

 

<view>

<blockwx:for="{{names}}"wx:key="item">

{{item}}

</block>

</view>

.js

 

Page({

data:{

names:[

'Tom',

'Peter',

'Gray',

'Lisa'

]

},

})

或者先在js中连接好，放在data中，再显示在wxml中：  .wxml

 

<view>

{{content}}

</view>

.js

 

Page({

data:{

content:"",

names:[

'Tom',

'Peter',

'Gray',

'Lisa'

]

},

onLoad(options){

let content =this.data.names.join(" ")

this.setData({

content

})

}

})

有了wxs后，我们可以直接在wxml完成：

.wxml

 

<wxsmodule="util">

var joinArray = function (array) {

return array.join(' ')

}

 

module.exports = {

joinArray: joinArray

}

</wxs>

<view>

{{util.joinArray(names)}}

</view>

或者将工具函数保存为单独的文件，通过引入来使用：  /src/wxs/common.wxs

 

var joinArray =function(array){

return array.join(' ')

}

 

module.exports ={

joinArray: joinArray

}

/pages/index/index.wxml

 

<wxssrc="../../src/wxs/common.wxs"module="util"/>

<view>

{{util.joinArray(names)}}

</view>

引入的时候，wxs标签src填写相对路径（绝对路径无效），module指定名字。

我们也可以将页面中的一些常量放在wxs中:

 

var MAX_COUNT =19

module.exports ={

MAX_COUNT: MAX_COUNT

}

总结：