微信小程序的指令与事件绑定

一、指令

1、

1）wx:if   /   wx:elif   /   wx:else

block   wx:if

因为 wx:if 是一个控制属性，需要将它添加到一个标签上。如果要一次性判断多个组件标签，可以使用一个 <block/> 标签将多个组件包装起来，并在上边使用 wx:if 控制属性。

注意： <block/> 并不是一个组件，它仅仅是一个包装元素，不会在页面中做任何渲染，只接受控制属性。

2）hidden

wx:if vs hidden

wx:if :组件会根据判断条件来控制一个元素是否渲染。（条件为false，则不会渲染这个元素。）

hidden :组件始终会被渲染，只是简单的控制显示与隐藏。

一般来说，wx:if 有更高的切换消耗而 hidden 有更高的初始渲染消耗。因此，如果需要频繁切换的情景下，用 hidden 更好，如果在运行时条件不大可能改变则 wx:if 较好。

2、

wx:for

遍历一维数组

遍历对象

二、事件绑定

事件类别：

tap：点击事件；

longtap：长按事件；

touchstart：触摸开始；

touchend：触摸结束；

touchcansce：取消触摸；

事件绑定：

bind绑定；

catch绑定；（能阻止事件冒泡）

例如：绑定点击事件 bindtap

page.wxml 文件

<view bindtap="fn">点击</view>

page.js 文件

微信小程序事件绑定详解

事件详解：（类型 type ; 时间戳 timeStamp；事件源组件 target ； 当前事件 currentTarget ； 触摸点数 touches）

在冒泡的事件中： currentTarget 和 target是不一致的； currentTarget是我们绑定了的组件，target是发生事件的组件；

调用项目下的其他事件及调用app.js里面的事件：