wxs,小程序中的wxs文件-即速应用

wxs,小程序中的wxs文件

浏览量：2380 时间：2019-12-09 来源：拾掇时光的印记

注意（来自官方文档）wxs不依赖于运行时的基础库版本，可以在所有版本的中运行。wxs与javascript是不同的语言，有自己的语法，并不和javascript一致。wxs的运行环境和其他javascript代码是隔离的，wxs中不能调用其他javascript文件中定义的函数，也不能调用小程序提供的API。wxs函数不能作为组件的事件回调。由于运行环境的差异，在iOS设备上小程序内的wxs会比javascript代码快2~20倍。在android设备上二者运行效率无差异。举个例子，在wxs出来之前，如果我们要连接一个数组的内容并显示在wxml中，我们需要通过循环连接数组的每一项：.wxml
viewblockwx: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){letcontent=this.data.names.join("")this.setData({content})}})有了wxs后，我们可以直接在wxml完成：
.wxml
wxsmodule="util"varjoinArray=function(array){returnarray.join('')}module.exports={joinArray:joinArray}/wxsview{{util.joinArray(names)}}/view或者将工具函数保存为单独的文件，通过引入来使用：/src/wxs/common.wxs
varjoinArray=function(array){returnarray.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中:
varMAX_COUNT=19module.exports={MAX_COUNT:MAX_COUNT}总结：
WXS增强了wxml的功能，相当于页面中的脚本语言，我们可以将比如检查手机格式的函数放在wxs中来使用（根据是否正确来改变相应的样式），而不用跑到在js中去检查。需要注意的地方：
wxs目前似乎并不支持ES6（至少let不能使用）wxs文件不能被js文件引用。wxs文件能引用wxs文件。参考：

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题，烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ，我们将及时处理。本站文章仅作分享交流用途，作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关，请知悉。