微信小程序 14:什么是wxs,wxs的使用

wxs是小程序独有的一套脚本语言,结合wxml,可以构建出页面的结构

wxs的应用场景

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

wxs和js的关系

wxs有自己的数据类型

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

wxs不支持es6以上的语法结构

  • 不支持:let,const,解构赋值,展开运算符,箭头函数,对象属性简写
  • 支持:var定义变量,普通function函数类似于es5语法

wxs遵循commonjs规范

  • module对象
  • require()函数
  • module.exports对象

内嵌wxs脚本

wxs可以嵌套在wxml文件中的标签,就像Javascript代码可以编写在html中scrupt标签内一样
wxml文件中的每个标签,必须提供module属性,用来制定当钱的wxs的模块名称,方便在wxml中访问模块中的成员。

<view>{{m1.toUpper(username)}}</view>
<wxs module="m1">
  // 将文本转位大写
  module.exports.toUpper = function(str){
    return str.toUpperCase()
  }
</wxs>

m1主要是为了给wxs命名,然后调用toUpper进行调用函数

定义外连样式

创建一个单独的文件,tools.wxs在里面写代码,并且在代码中定义module.export = {toLower:toLower}
并且在wxml文件中进行引用

<view>{{m2.toLower(country)}}<view>
<wxs src="tools.wxs" module="m2"></wxs>

src: 必须是相对路径
module用来指定模块的名称

注意

  1. wxs不能调用js中定义的函数
  2. wxs不能调用小程序的API
  3. wxs在ios性能好,比js快2-20倍,但是在安卓上面差不多
  • 7
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

饭一口口吃

来杯咖啡

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值