一个 Android程序员的小程序入门学习笔记『三』（自定义属性和获取属性）

注：文章中有些地方会把小程序的内容和 Android 的知识关联起来，以便于 Android 程序员更快的理解小程序。

tap 事件

小程序中没有 onClick 事件，需要通过 bindtap 或者 catchtap 事件来获取点击事件，

两者的区别是：bindtap 不消费 onTouch 事件，catchtap 消费 onTouch 事件。

自定义属性

如果想在每一个for循环中取得自定义属性的属性值，那么就需要给该 UI 控件设置一个 id ，

这个 id 也要和 数据源的 item 绑定。

此时，需要自定义属性名，在小程序中，自定义属性的规则为：

data-xxx  或者data-xxx-xxx-xxx

红色的data-是固定的，后续xxx可以随意填写。

例如， template 模版的父 view 中，设置自定义属性名如下

    <block wx:for="{{yy.data}}">
        <view catchtap="onTextTap" data-idxx-ABC-Def-ghm-nQP="{{item.idxx}}">
            <template is="templateMain" data="{{item}}"/>
        </view>
    </block>

这里，自定义属性为

data-idxx-ABC-Def-ghm-nQP

设置的复杂是为了说明属性值在 js 中的获取规则，往下看。

在 js 代码中通过如下方式获取自定义属性和值：

onTextTap: function (event) {
        var idc = event.currentTarget.dataset.idxxAbcDefGhmNqp;
        console.log("onTextTap = " + idc);
    },

event.currentTarget.dataset.     这个前半段是固定的写法，

最后的 idxxAbcDefGhmNqp 才是我们自己定义的属性名，

这里我们可以看到，设置自定义属性时候填写的 xxx 都被自动转换成了驼峰命名法的属性名！

另外，注意， 这个 target 和 currentTarget 的区别是：

target 指的是当前点击（bindtap）的组件，currentTarget 指的是捕获事件( catchtap )的组件。

event.target.dataset.    //  对应 bindtap 的组件携带的数据

由于 微信 ide 代码补全不够完善，这里只能自己注意。