小程序wxs

news/2024/10/30 23:21:35/

什么是wxs

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

wxs的应用场景

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

wxs和JavaScript的关系

  1. wxs有自己的数据类型
    • number、string、Boolean、Object、function、array、date、regexp
  2. wxs不支持类似于ES6及以上的语法
    • 不支持:let、const、解构赋值、展开运算符、箭头函数、对象属性简写等
    • 支持:var定义变量、普通function函数
  3. wxs遵循CommonJS规范
    • module对象
    • require() 函数
    • module.exports对象

wxs的基本用法

1. 定义内联的wxs脚本

wxs代码可以编写在wxml文件中的 标签中,就像JavaScript代码可以编写在html文件中的

2. 定义外联的wxs脚本

wxs代码还可以编写在以.wxs为后缀名的文件中,就像JavaScript代码可以编写在以.js为后缀名的文件中一样。示例代码:

// tools.wxs文件
function toLower(str){return str.toLowerCase();
}module.exports = {toLower:toLower
}

外联脚本的使用

在wxml中引入外联的wxs脚本时,必须为标签添加module和src属性,其中:

  • module用来指定模块的名称
  • src用来指定要引入的脚本的路径,且必须是相对路径

示例代码:

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

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

相关文章

微信小程序wx.request(1)——基本操作

微信小程序的wx.request是微信小程序最早生成的数据库传输模式&#xff0c;数据传输简单明确。接下来&#xff0c;我们来操作下微信小程序如何链接数据库。 首先&#xff0c;wx.request整体的架构如下&#xff1a; wx.request({url:https://域名ID/index.php, //必填&#xff…

《五》微信小程序中的 WXS(WeiXin Script)

WXS 是小程序的一套脚本语言&#xff0c;结合 WXML&#xff0c;可以构建出页面的结构。 WXS 代码可以编写在 WXML 文件中的 <wxs> 标签内或以 .wxs 为后缀名的文件内。每一个 <wxs> 标签和 .wxs 文件都是一个单独的模块&#xff0c;每个模块都有自己独立的作用域&…

微信小程序2-WXSS,WXS

微信小程序1-小程序基础,开发工具安装使用 1.WXSS WXSS (WeiXin Style Sheets)是一套样式语言&#xff0c;用于描述 WXML 的组件样式 为了适应广大的前端开发者&#xff0c;WXSS 具有 CSS 大部分特性。同时为了更适合开发微信小程序&#xff0c;WXSS 对 CSS 进行了扩充以及修…

微信小程序基础02--WXML,WXSS基础

1.WXML语法参考 1.1数据绑定 WXML 中的动态数据均来自对应 Page 的 data。数据绑定&#xff0c;js文件里的data属性,在wxml中直接使用{{ }}进行绑定。与vue的写法十分相似。 特别注意&#xff1a;bool类型不要直接写 checked“false”&#xff0c;其计算结果是一个字符串&…

wx小程序

wx小程序 1.基础知识点 数据在js的data中绑定 在.wxml中渲染使用双花括号 即&#xff1a;{{}} 在渲染时可以用三元表达式和算法 在.wxss中写css样式 .wxml中没有div 标签&#xff0c;但是有相对应的标签view 2.事件绑定 1).点击事件 给标签绑定事件 <text>{{num…

微信小程序开发之——weui-wxss的使用

概述&#xff1a; WeUI 是一套同微信原生视觉体验一致的基础样式库&#xff0c;由微信官方设计团队为微信内网页和微信小程序量身设计&#xff0c;令用户的使用感知更加统一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。 预览&…

微信小程序 Wxs篇

WXS&#xff08;WeiXin Script&#xff09;是小程序的一套脚本语言&#xff0c;结合 WXML&#xff0c;可以构建出页面的结构。 【注意】 WXS 不依赖于运行时的基础库版本&#xff0c;可以在所有版本的小程序中运行。WXS 与 JavaScript 是不同的语言&#xff0c;有自己的语法&…

入门微信小程序开发(二)wxml与wxss

一.初识WXML 对于每一位前端开发者而言&#xff0c;熟练的编写静态页面是入门的开始&#xff0c;在小程序中这一点也无法避免。在介绍微信小程序功能交互之前&#xff0c;我们先了解在小程序中如何实现页面布局与页面样式&#xff0c;这里先来介绍WXML。 WXML全称WeiXin Mark…