【微信小程序WXS 模块】

news/2024/10/31 1:33:25/

WXS 模块WXS 代码可以编写在 wxml 文件中的 标签内,或以 .wxs 为后缀名的文件内。模块每一个 .wxs 文件和 标签都是一个单独的模块。每个模块都有自己独立的作用域。即在一个模块里面定义的变量与函数,默认为私有的,对其他模块不可见。一个模块要想对外暴露其内部的私有变量与函数,只能通过 module.exports 实现。

首先一点WXS文件不能建立跟你页面同级的文件夹内,最好是跟Page同级,目前接触到的wxs有两种方式:

1,单独的文件形式,引入到页面的结构当中wxml,引入方式可以

对应的页面功能代码写入对应的wxs文件当中,通过引用的方式应用到页面当中

标签引入

require引入 var handleSrc = require(“./handleSrc.wxs”); 相对路径
上代码:
请添加图片描述

2,直接在页面中使用:

请添加图片描述

在视图容器中使用的时候就是你定义的mode名.方法(参数)见下:

请添加图片描述

注意
  1. WXS 不依赖于运行时的基础库版本,可以在所有版本的小程序中运行。

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

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

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

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

WXS语法总结

一、变量

WXS变量和我们的JavaScript是一样的,都是值的引用,也是用var申明。

不同的是,在WXS中,没有被声明的对象也可以直接赋值。会被定义为全局变量。

和JavaScript一样,WXS变量也会有保留标识符。

强调一下,这里变量只支持var 不支持let

二、注释

WXS注释有三种方法。单行注释和多行注释,还有一种就是结尾注释。结尾注释其实就是从多行注释那里来的,只是不要收尾处,就成了结尾注释了。

三、运算符

WXS的运算符和JavaScript的其实是一样的,都有基本运算符。加减乘除。一元运算符:自增自减这些;比较运算符,大于小于;等值运算符,全等非全等;逻辑运算符,逻辑与&&和逻辑非||。

四、语句

WXS语句也是和JavaScript一样。

五、数据类型

WXS的数据类型和JavaScript的相似,不同的是,多了两个数据类型,date日期类型和regexp:正则。

其他的就不在这里提了,需要说的是日期类型date和正则regexp。

date:
生成 date 对象需要使用 getDate函数, 返回一个当前时间的对象。

例如:
请添加图片描述

regexp:
生成 regexp 对象需要使用 getRegExp函数。

语法:
请添加图片描述

例如:
请添加图片描述

另外数据类型的判断可以使用constructor 属性。使用 typeof 也可以区分部分数据类型。

例如:
请添加图片描述

六、基础类库

基础库类就是WXS中自带的可以直接拿来使用的方法类。

例如console.log(),Math方法,JSON方法,Number,Date,Global方法等。

欧克,今天的分享就到次为止,年轻人不讲武德,不给我点个赞,耗子尾汁,溜了!


http://www.ppmy.cn/news/305209.html

相关文章

小程序wxs使用教程

1、什么是wxs wxs是小程序的一种脚本语言,它类似JavaScript,但是与JavaScript有所不同。wxs是一种数据绑定和逻辑处理的语言,它可以在wxml中使用,并且可以在wxml中直接调用。使用wxs可以实现更高效、更灵活的数据处理和渲染。 2…

robots.txt的作用是什么,看完了我默默加在了自己网站上

文章目录 背景robots.txt的主要作用使用示范User-agentDisallowAllowSitemap 总结 背景 最近在研究网站SEO相关的东西,第一次接触到robots.txt,才发现实际上很多网站都用到了它,尤其是对搜索引擎依赖特别高的C端系统或者网站,是一…

微信小程序实战 (WXSS:小程序版CSS、WXS:小程序版JavaScript)

上一篇讲了WXML:小程序版HTML,这一篇介绍WXSS:小程序版CSS。 1. WXSS:小程序版CSS。 WXSS是一套样式语言,为了便于前端开发的上手,WXSS同HTML的CSS样式文件大部分特性一样。它用来决定WXML的样式,同时在CSS基础上进行了修改扩充…

【微信小程序】WXML WXSS JS

目录 🍓小程序代码的构成 - WXML 模板 1. 什么是 WXML 2. WXML 和 HTML 的区别 🍇小程序代码的构成 - WXSS 样式 1. 什么是 WXSS 2. WXSS 和 CSS 的区别 🍒小程序代码的构成 - JS 逻辑交互 1. 小程序中的 .js 文件 2. 小程序中 .js 文…

【小程序】中WXS的语法详解

文章目录 WXS基本使用🍰WXS的介绍🍰WXS的写法🍰WXS的练习(一)🍰WXS的练习(二) WXS基本使用 🍰WXS的介绍 WXS(WeiXin Script)是小程序的一套脚本语言,结合 WXML,可以构建…

微信小程序 | 小程序WXSS-WXML-WXS

🖥️ 微信小程序 专栏:小程序WXSS-WXML-WXS 🧑‍💼 个人简介:一个不甘平庸的平凡人🍬 ✨ 个人主页:CoderHing的个人主页 🍀 格言: ☀️ 路漫漫其修远兮,吾将上下而求索☀️ &#x1…

20230608----重返学习-react项目的细节

day-088-eighty-eight-20230608-react项目的细节 react项目的细节 进入登录页的情况分析 什么情况下,会进入登录页? 手动输入 /login 地址http://127.0.0.1:3000/#/login 登录成功:跳转到首页push() 我原本想进入的是 个人中心/我的收藏/…

Pascal Voc 2007 2012

1、简介 PASCAL 全称:Pattern Analysis, Statical Modeling and Computational Learning PASCAL VOC(The PASCAL Visual Object Classes )是一个经典的计算机视觉数据集,由牛津大学、马里兰大学和微软剑桥研究院的研究人员创建的…