小程序WXS 模块
WXS(WeiXin Script)是小程序的一套脚本语言,结合 WXML,可以构建出页面的结构
WXS中定义的函数可以在wxml文件中使用,可以用它来当过滤器使用
WXS以.wxs扩展名结尾,文件中代码写法和JS类似,不支持ES6写法
1:创建wxs模块
2:
function mysub(str,start,len){ var offset=start || 0;
var len= len || 10;
len= Math.min(20,len);
if(str.length<=len){
return str;
}else{
return str.substring(offset,len)+'...'; } }
// module.exports={mysub:mysub}; module.exports.mysub = mysub;
3:
调用
在wxml文件去引用
引用的时候一定要用相对应地址
每个 wxs 模块均有一个内置的 module 对象
命名空间:
<wxs src="../../tools.wxs" module="tools" />
wxjs:data数据进行循环
// pages/per/per.js Page({ /**
* 页面的初始数据
*/
data: { region: ['广东省', '广州市', '海珠区'],
title:
[
{content:'上海全栈开发学院1906a闫兵上海全栈开发学院1906a闫兵上海全栈开发学院1906a闫兵'},
{content:'上海全栈开发学院1906a闫兵上海全栈开发学院1906a闫兵上海全栈开发学院1906a闫兵上海全栈开发学院1906a闫兵'},
{content:'上海全栈开发学院1906a闫兵上海全栈开发学院1906a闫兵上海全栈开发学院1906a闫兵上海全栈开发学院1906a闫兵'} ] },
wxml:代码
<!-- 引入tools.wxs -->
<wxs src="../w/tools.wxs" module="tools" /> <block wx:for="{{title}}" wx:key="index">
<view>
{{tools.mysub(item.content,0,20)}}
</view>
</block>
效果图:
小程序WXS 模块的更多相关文章
- 安装odoo小程序商城模块报错 KeyError: u'oejia_weshop'
错误截图如下 检查模块目录名是否不是 oejia_weshop,比如 oejia_weshop-master,注意odoo的模块名不能随便更改,odoo小程序商城模块目录名必须是oejia_wesho ...
- Odoo 开源微信小程序商城模块
详见:http://oejia.net/blog/2018/09/13/oejia_weshop_about.html oejia_weshop Odoo 微信小程序商城模块 oejia_weshop ...
- 微信小程序蓝牙模块
蓝牙部分知识 关于Service: 每个设备包含有多个Service,每个Service对应一个uuid 关于Characteristic 每个Service包含多个Characteristic,每个 ...
- 微信小程序 wxs的简单应用
Demo地址:微信小程序wxs的简单应用 案例分析 张三.李四.王五,各自分别都有数量不等的车,现在需要列表显示名字及他们拥有车的数量, list数据结构如下,当我们使用wx:for进行显示时,发现个 ...
- 微信小程序 WXS实现json数据需要做过滤转义(filter)
前言 最近有在做小程序开发,在开发的过程中碰到一点小问题,描述一下先. 本人在职的公司对于后台获取的 json 数据需要做过滤转义的很多,不同的状态码会对应不同的文字,但是在微信小程序中又没有类似 v ...
- 微信小程序のwxs语言
一.wxs介绍 wxs是微信小程序自身的脚本语言,用来过滤和计算.wxs可以通过文件可模块标签来定义 文件需要.wxs后缀文件 二.实例 <wxs module="test1" ...
- .NET开发微信小程序-Template模块开发
1.添加一个文件目录,里面放模板信息 例:我在根目录添加一个文件夹:template 然后在这个文件夹下面添加相应的页面.比如我添加一个promodel.wxml文件.主要是放商品相关的模块信息(注: ...
- 微信小程序地图模块
微信小程序的地图模块官方提供的API比较少,详情请见 官方文档 以下为一个示例 <!--pages/location/locati ...
- 微信小程序-wxs
你想在页面上使用JavaScript代码吗? 对不起,小程序不支持! 最近,一个项目就有这样的需求,我也就用上了wxs 使用方法很简单: 项目中用的是取小数点2位以及5位 具体请看官方API:WXS
随机推荐
- play的action链(一个action跳转到另一个action,类似于重定向)
在play中没有Servlet API forward 的等价物.每一个HTTP request只能调用一个action.如果我们需要调用另一个,必须通过重定向,让浏览器访问另一个URL来访问它.这样 ...
- k8s之Pod基础概念
1. 资源限制 Pod是kubernetes中最小的资源管理组件,Pod也是最小化运行容器化应用的资源对象.一个Pod代表着集群中运行的一个进程.kubernetes中其他大多数组件都是围绕着Pod来 ...
- 一文详解Kafka API
摘要:Kafka的API有Producer API,Consumer API还有自定义Interceptor (自定义拦截器),以及处理的流使用的Streams API和构建连接器的Kafka Con ...
- gitlab登录时出现402的错误
当登录gitlab时出现402的错误提示,可进行以下操作 重新设置一下系统时间 在new project 时若还出现同样的402问题,则清除一下浏览器的cookie即可
- ASP.NET Core 6框架揭秘实例演示[02]:基于路由、MVC和gRPC的应用开发
ASP.NET Core可以视为一种底层框架,它为我们构建出了基于管道的请求处理模型,这个管道由一个服务器和多个中间件构成,而与路由相关的EndpointRoutingMiddleware和Endpo ...
- swpu新生赛ctf wp
WEB:gift_F12 没啥好说的 直接F12得了 NSSCTF{We1c0me_t0_WLLMCTF_Th1s_1s_th3_G1ft} RE 简简单单的解密 import base64, url ...
- 降维处理PCA
要理解什么是降维,书上给出了一个很好但是有点抽象的例子. 说,看电视的时候屏幕上有成百上千万的像素点,那么其实每个画面都是一个上千万维度的数据:但是我们在观看的时候大脑自动把电视里面的场景放在我们所能 ...
- spring mvc通过客户端传值,controller获取Sort对象
之前客户端需要根据需求按不同的排序方式查看数据,按照一种约定排序,比如1代表时间升序,2代表时间降序,3,4这种形式,然后后台根据这些值创建Sort对象. 后来发现完全多此一举,可以根据特定的方式,直 ...
- 基于TI DSP TMS320C6678、Xilinx K7 FPGA XC7K325T的高速数据处理核心板
一.板卡概述 该DSP+FPGA高速信号采集处理板由我公司自主研发,包含一片TI DSP TMS320C6678和一片Xilinx FPGA K7 XC72K325T-1ffg900.包含1个千兆网口 ...
- Linux常用命令在Ubuntu 16下(个人笔记)
可以通过 tab键来补全提示命令或者目录,终端命令的格式: 命令 [-选项,多个选项可以结合写] [参数] , 大多数情况可以通过 ctrl c 退出命令 磁盘管理 pwd 查看当前所在目录 即:pr ...