列表渲染
<view wx:for="{{[1, 2, 3, 4, 5, 6, 7, 8, 9]}}" wx:for-item="i" wx:for-index="a"> <view wx:for="{{[1, 2, 3, 4, 5, 6, 7, 8, 9]}}" wx:for-item="j" wx:for-index="b"> <view wx:if="{{i <= j}}"> {{i}} * {{j}} = {{i * j}} </view> </view> </view>wx:for-item 与 wx:for-index 用来解决多层循环嵌套item 与 index 重复的问题。
另外，还有一个 wx:key 的控制属性，它的取值有 String 与 *this 两种。
String 可以是 for循环中每个 item自身的 property 的名称，这个 property 的值要保证在整个循环遍历中，相对其它的 item property的值都是唯一的。
*this 则是代表每次循环的 item本身，这种表示需要 item 本身是一个唯一的字符串或者是数值。
wx:key 要求唯一的原因是当数据改变触发渲染时，列表中通过 wx:key 指定的选项，不会被重新渲染只会改变位置顺序，也就是说不会被移出重新插入，从而能够保持一种固定的状态。这样也更加的节省性能。当然如果你非常确定你的列表是静态的并且不会发生改变，那么也无需使用该属性。
block
当我们在模版中使用控制属性，总需要将其挂载到一个组件上，这往往就会让不需要组件加入到页面渲染中。
为了解决这个问题，小程序提供了另一个特殊的组件：<block> </block>，使用 block 以作为控制属性的载体，并切不会被渲染到页面上。
https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxml/ (更多关于模版以及模版语法)
自定义模版WXML支持两种模版类型，一种是通过 <template> 组件定义的“动态模版”，我们可以向“动态模版”中传入数据，并运用表达式、模版语法、控制属性等进行运算。另一中就是“静态模版”，通过 <include> 组件将静态的 wxml 文件引入到指定的位置中。
动态模版
定义模版
<template> <view wx:for="{{arrs}}"></view> </template>调用模版
<template is="example-tem" data="{{arrs:[1,2,3]}}"外部导入模版并调用
<import src="http://www.likecs.com/template/example-tem" /> #引入外部模版 <template is="example-tem" data="{{arrs:[1,2,3]}}" #使用模版静态模版
总结
对比 import ,include 只是单纯的将一个模版中的所有组件内容拷贝到你使用 include 的位置处(需要注意的是模版中的 template 与 wxs不能被拷贝)。除此之外，import 有自己的作用域，如果要传递数据到对应的 template内，须要借助 data 属性。
微信小程序支持类似 vue的MVVM模式，即数据（逻辑层）与视图（渲染层）相互分离，当数据发生改变的时候，可自动的刷新视图。
使用起来也非常简单，通过模版的表达式结合逻辑层的 setData 方法既可以使用。
示例:
事件绑定(支持事件冒泡)
bind:eventName事件绑定(不支持事件冒泡)
catch:eventName事件捕获(可以再冒泡)
capture-bind:eventName事件捕获(不会冒泡)
capture-catch 自定义组件“自定义组件”可以认为是具有特定可复用功能的最小型页面，“自定义组件”与小程序内置组件一样可以定制自己的功能，数据还有属性。
“自定义组件”的目录结构以及代码构成与普通页面完全一致，其中 *.js是自定义组件的数据方法文件，*.json是配置文件。*.wxml是自定义组件的结构模版文件，*.wxss是自定义组件的样式文件。
首先建立组件的目录，然后创建以下几个文件（比如这里以assambley）为例：
assembly: - assembly.wxml - assembly.wxss - assembly.js - assembly.json接着在 assembly.wxml、assembly.wxss中编写好你的结构与样式代码，在你的JS文件中调用 Component()构造函数，来实例化一个组件实例：
Component({ //行为 behaviors:[], //数据 data: { names: Math.random() }, //属性 properties: { nowIn: String }, //方法 methods: { showData: function(e) { let radomNumber = Math.random(); this.setData({ names: radomNumber }); //自定义触发的事件 this.triggerEvent('assmbleySignal', this.data.names); } }, //生命周期函数 attached: function() { this.triggerEvent('assmbleySignal', this.data.names); } });最后在 assembly.json 中进行组件的声明。
{ "component":true }这样一个组件就定义完成了，使用的时候，只需要在用到的页面或者是其它组件中，对它们的配置文件添加以下配置即可（例如这里以index页面为例）
#index.json "usingComponents": { "assembly": "/pages/component/assembly/assembly" }