<view> {{message}} </view>
// page.js Page({ data: { message: 'Hello MINA!' } })
组件属性(需要在双引号之内)
<view id="item-{{id}}"> </view>
Page({ data: { id: 0 } })
控制属性(需要在双引号之内)
<view wx:if="{{condition}}"> </view>
Page({ data: { condition: true } })
关键字(需要在双引号之内)
true, b: 2, c: 3 } })
} })
, 1, 2, 3, 4], b: 2 } })
, b: 2 }, obj2: { c: 3, d: 4 } } })
, b: 2 }, obj2: { b: 3, c: 4 }, a: 5 } })
, unique: 'unique_5'}, {id: 4, unique: 'unique_4'}, {id: 3, unique: 'unique_3'}, {id: 2, unique: 'unique_2'}, {id: 1, unique: 'unique_1'}, {id: 0, unique: 'unique_0'}, ], numberArray: [1, 2, 3, 4] },
switch: function(e) { const length = this.data.objectArray.length for (let i = 0; i < length; ++i) { const x = Math.floor(Math.random() * length) //向下取整 const y = Math.floor(Math.random() * length) const temp = this.data.objectArray[x] this.data.objectArray[x] = this.data.objectArray[y] //2个值交换一下 this.data.objectArray[y] = temp } this.setData({ objectArray: this.data.objectArray }) },
addToFront: function(e) { const length = this.data.objectArray.length this.data.objectArray = [{id: length, unique: 'unique_' + length}].concat(this.data.objectArray) this.setData({ objectArray: this.data.objectArray }) },
addNumberToFront: function(e){ this.data.numberArray = [ this.data.numberArray.length + 1 ].concat(this.data.numberArray) this.setData({ numberArray: this.data.numberArray }) } })
, msg: 'this is a template', time: '2016-09-15' } } })
, "target": { "id": "tapTest", "dataset": { "hi":"WeChat" } }, "currentTarget": { "id": "tapTest", "dataset": { "hi":"WeChat" } }, "detail": { "x":53, "y":14 }, "touches":[{ "identifier":0, "pageX":53, "pageY":14, "clientX":53, "clientY":14 }], "changedTouches":[{ "identifier":0, "pageX":53, "pageY":14, "clientX":53, "clientY":14 }] }
// - 会转为驼峰写法 event.currentTarget.dataset.alphabeta === 2 // 大写会转为小写 } })
, "y":14 },
, "pageX":53, "pageY":14, "clientX":53, "clientY":14 }],
, "pageX":53, "pageY":14, "clientX":53, "clientY":14 }]
changedTouches 数据格式同 touches。 表示有变化的触摸点,如从无变有(touchstart),位置变化(touchmove),从有变无(touchend、touchcancel)。
WXML 提供两种文件引用方式import和include。
import
import可以在该文件中使用目标文件定义的template,如:
在 item.wxml 中定义了一个叫item的template: <template name="item"> <text>{{text}}</text> </template>
在 index.wxml 中引用了 item.wxml,就可以使用item模板:
<import src="item.wxml"/> <template is="item" data="{{text: 'forbar'}}"/>
import 的作用域
只会 import 目标文件中定义的 template,而不会 import 目标文件 import 的 template。即不会递归引用
如:C import B,B import A,在C中可以使用B定义的template,在B中可以使用A定义的template,但是C不能使用A定义的template。
include
include 可以将目标文件除了 <template/> <wxs/> 外的整个代码引入,相当于是拷贝到 include 位置,如:
<!-- index.wxml --> <include src="header.wxml"/> <view> body </view> <include src="footer.wxml"/>
<!-- header.wxml --> <view> header </view>
<!-- footer.wxml --> <view> footer </view>
- 微信小程序支付简单小结与梳理
前言 公司最近在做微信小程序,被分配到做支付这一块,现在对这一块做一个简单的总结和梳理. 支付,对于购物来说,可以说是占据了十分重要的一块,毕竟能收到钱才是重点. 当然在开发之前,我们需要有下面这些东 ...
- 微信小程序wxml文件中调用自定义函数
想在微信小程序的wxml文件里自如的像vue那样调用自定义的方法,发现并不成功,得利用WXS脚本语言. WXS脚本语言是 WeiXin Script 脚本语言的简称,是JavaScript.JSON. ...
- [转]微信小程序支付简单小结与梳理
本文转自:https://www.cnblogs.com/onetwo/p/6667424.html 公司最近在做微信小程序,被分配到做支付这一块,现在对这一块做一个简单的总结和梳理. 支付,对于购物 ...
- 微信小程序wxml和wxss样式
对于css不熟悉的android程序员来说,开发微信小程序面临的一个比较困难的问题就是界面的排版了.微信小程序的排版就跟wxml和wxss有关了,它们两者相当于android的布局文件,其中wxml指 ...
- 微信小程序 WXML、WXSS 和JS介绍及详解
前几天折腾了下.然后列出一些实验结果,供大家参考. 百牛信息技术bainiu.ltd整理发布于博客园 0. 使用开发工具模拟的和真机差异还是比较大的.也建议大家还是真机调试比较靠谱. 1. WXML( ...
- 微信小程序 wxml 文件中如何让多余文本省略号显示?
废话不多说,之前写小程序碰到了一个问题,如何在 wxml 页面中截取数据? 1.wxs 取数据想必大家都会,不就是 substring 吗?但是这种方法在 wxml 页面中是无效的. 那还有 cs ...
- 微信小程序wxml页面toFixed保留两位小数,wxs脚本语言
在wxml页面执行toFixed函数的时候发现失效,在微信小程序的js页面是生效的,但是我不希望在data中保留这些额外的数据,于是找到了下面这种解决方案wxs脚本语言. <wxs module ...
- 微信小程序のwxml绑定
一.微信小程序文件的构成 微信小程序包括js文件.json文件.wxml文件.wxss文件.wxs文件.js文件是展现界面的,注册这个程序的的页面,一般一个大写的Page({ })嵌入: json文件 ...
- 微信小程序WXML页面常用语法(讲解+示例)
(一) WXML 是什么 官方说明:WXML(WeiXin Markup Language)是框架设计的一套标签语言,结合基础组件.事件系统,可以构建出页面的结构 在前面我们就已经提过,WXML,就可 ...
随机推荐
- Lina Group
var query = from ll in proListRequestList group ll by new {ll.pro_id} into g select new ProListReque ...
- Openerp约束句型
内容摘自:http://blog.csdn.net/sz_bdqn/article/details/8785483 _constraints _constraints可以灵活定义OpenERP对象的约 ...
- linux中的strip命令简介------给文件脱衣服
1.去掉-g,等于程序做了--strip-debug2.strip程序,等于程序做了--strip-debug和--strip-symbol 作为一名Linux开发人员, 如果没有听说过strip命令 ...
- JavaMelody、prob系统监控工具使用配置
分类: 工具 2014-04-23 14:41 1857人阅读 评论(1) 收藏 举报 目录(?)[+] 项 目开发结束了,需要做一下压力测试,就使用apache自带的ab程序进行压力测试,300个并 ...
- (四)Oracle学习笔记—— 常见函数
1. 字符串类型及函数 字符类型分 种,char(n) .varchar(n).varchar2(n) : char(n)固定长度字符串,假如长度不足 n,右边空格补齐: varchar(n)可变长度 ...
- zabbix触发的多条件判断表达式
2 Trigger expression Overview The expressions used in triggers are very flexible. You can use them ...
- Linux-查看进程的完整路径
通过ps及top命令查看进程信息时,只能查到相对路径,查不到的进程的详细信息,如绝对路径等.这时,我们需要通过以下的方法来查看进程的详细信息:Linux在启动一个进程时,系统会在/proc下创建一个以 ...
- 解决 SQL Server2012附加出错的问题
附加数据库出错 无法打开文件号 0 的文件 操作系统错误 根据错误提示:权限不足,添加相应权限就OK 步骤:1,右键单击要附加的数据库,选择安全选项卡选择用户:“Authenticated Users ...
- ASP.NET 推荐书籍
ASP.NET 推荐书籍 1.首先推荐一本ASP.NET MVC的书籍 —— <Web开发新体验:ASP.NET 3.5 MVC架构与实战> [点评]:ASP.NET的MVC的书籍本来就不 ...
- php中数据类型自动转换
1.1 转为布尔型(即返回值为0) 空字符串''或"" 数字0或0.0 字符'0'或"0" 空值NULL 没有成员的数组 其余都转换成布尔型true,包含 ...