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 模块的更多相关文章

  1. 安装odoo小程序商城模块报错 KeyError: u'oejia_weshop'

    错误截图如下 检查模块目录名是否不是 oejia_weshop,比如 oejia_weshop-master,注意odoo的模块名不能随便更改,odoo小程序商城模块目录名必须是oejia_wesho ...

  2. Odoo 开源微信小程序商城模块

    详见:http://oejia.net/blog/2018/09/13/oejia_weshop_about.html oejia_weshop Odoo 微信小程序商城模块 oejia_weshop ...

  3. 微信小程序蓝牙模块

    蓝牙部分知识 关于Service: 每个设备包含有多个Service,每个Service对应一个uuid 关于Characteristic 每个Service包含多个Characteristic,每个 ...

  4. 微信小程序 wxs的简单应用

    Demo地址:微信小程序wxs的简单应用 案例分析 张三.李四.王五,各自分别都有数量不等的车,现在需要列表显示名字及他们拥有车的数量, list数据结构如下,当我们使用wx:for进行显示时,发现个 ...

  5. 微信小程序 WXS实现json数据需要做过滤转义(filter)

    前言 最近有在做小程序开发,在开发的过程中碰到一点小问题,描述一下先. 本人在职的公司对于后台获取的 json 数据需要做过滤转义的很多,不同的状态码会对应不同的文字,但是在微信小程序中又没有类似 v ...

  6. 微信小程序のwxs语言

    一.wxs介绍 wxs是微信小程序自身的脚本语言,用来过滤和计算.wxs可以通过文件可模块标签来定义 文件需要.wxs后缀文件 二.实例 <wxs module="test1" ...

  7. .NET开发微信小程序-Template模块开发

    1.添加一个文件目录,里面放模板信息 例:我在根目录添加一个文件夹:template 然后在这个文件夹下面添加相应的页面.比如我添加一个promodel.wxml文件.主要是放商品相关的模块信息(注: ...

  8. 微信小程序地图模块

    微信小程序的地图模块官方提供的API比较少,详情请见   官方文档 以下为一个示例                               <!--pages/location/locati ...

  9. 微信小程序-wxs

    你想在页面上使用JavaScript代码吗? 对不起,小程序不支持! 最近,一个项目就有这样的需求,我也就用上了wxs 使用方法很简单: 项目中用的是取小数点2位以及5位 具体请看官方API:WXS

随机推荐

  1. Win10正式版屏幕一直闪烁怎么办

    这个原因是由于两个账户都在线,一个账户更替到另一个账户时出现的 解决办法:先注销一个账户,再登录到另一个账户,即只保持一个账户在线,就不会出现屏幕闪烁的情况.

  2. Idea中新建package包,却变成了Directory

    问题描述 今天在IdeaJava工程src下新建了一个名字叫包implements的包,右键在里面新建类时,却发现根本就没有Class这个选项,然后发现implements这个包的图标也和其他包的图标 ...

  3. AndroidStudio项目提交到github最详细步骤【转】

    感谢大佬:https://www.cnblogs.com/imqsl/p/6763133.html 在使用studio开发的项目过程中有时候我们想将项目发布到github上,以前都是用一种比较麻烦的方 ...

  4. 猪齿鱼平台常用前端css实现方案

    居中 最常用的height + line-height,以及margin:0 auto的居中方式就不再阐述,以下介绍两种容错性高的实现方案. flex布局实现 ​ 猪齿鱼前端日常开发中,我们多以fle ...

  5. Java经典案例之用三种方法求1~100以内素数之和

    素数,不能被除了1和本身以外整除的数被称为素数.接下来我用三种方式求得1~100以内素数. 方式一 外层每循环一次,内层就计算出这个数有几个因子,我们都知道素数的因子只有两个,所以如果个数为2就加进总 ...

  6. 关于基于GDAL库QT软件平台下C++语言开发使用说明

    背景前提 地理空间数据抽象库(GDAL)是一个用于读取和编写栅格和矢量地理空间数据格式的计算机软件库,由开源地理空间基金会在许可的X / MIT风格免费软件许可下发布. 作为一个库,它为调用应用程序提 ...

  7. 关于git和SVN的介绍和区别

    主要对git,svn进行一个简单的介绍. 顺带,我会在后面把我整理的一整套CSS3,PHP,MYSQL的开发的笔记打包放到百度云,有需要可以直接去百度云下载,这样以后你们开发就可以直接翻笔记不用百度搜 ...

  8. Solution -「USACO 2020.12 P」Spaceship

    \(\mathcal{Description}\)   Link.   Bessie 在一张含 \(n\) 个结点的有向图上遍历,站在某个结点上时,她必须按下自己手中 \(m\) 个按钮中处于激活状态 ...

  9. Session是什么?它与Cookie有什么区别?

    你好,是我琉忆. 今天我们讲一讲Session与Cookie的区别 1.Session对象 上一节简单介绍了Cookie,接下来简单介绍Session.Session和Cookie都是会话管理技术的一 ...

  10. JNDI漏洞利用探索

    最近学习了师傅寻找的一些JNDI漏洞的利用链受益匪浅,自己也尝试关于JNDI漏洞利用做一些挖掘,目前JNDI在利用过程我想到了两个问题. 测试每一个JNDI Bypass 利用链都需要手动更改URL很 ...