转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-11/

我们以前在web开发的时候,web页面也有一些相关的事件,当然小程序要接触屏幕要进行一些点击和拖动事件。源码:https://github.com/limingios/wxProgram.git 中的No.6

小程序的事件触发

通过行为进行的人机交互方式
类似于html的onClick,onChange事件等等

  1. 官方的阐述
    >https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxml/event.html

  1. 程序演示点击
//events.js
//获取应用实例
const app = getApp() Page({
data: {
motto: 'Hello World',
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
clickMe: function(){
console.log("你点击我这里出来了!")
}
})
<!events.wxml-->
<view class="container">
<text bindtap='clickMe'>点我点我我给console显示</text>
</view>

  1. 数据传递
    >通过view标签中的data来绑定数据
<!events.wxml-->
<view class="container">
<text data-forName='公众号:编程坑太多' data-forUser='开发人员' data-forDate='201800805' bindtap='clickMe'>点我点我我给console显示</text>
</view>
//events.js
//获取应用实例
const app = getApp() Page({
data: {
motto: 'Hello World',
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
clickMe: function(e){
console.log("你点击我这里出来了!")
console.log(e)
console.log(e.currentTarget.dataset.fordate)
}
})
  • 仔细观察的老铁会发现一个问题
    >在wxml里面forData是大写,在js里面的fordata自动变成了小写,这就是微信自己帮咱们把驼峰形式做了转换。

PS:小程序的事件基本就是这样,事件使用,事件分类,事件详情,这三个方向来使用。

「小程序JAVA实战」 小程序的事件(11)的更多相关文章

  1. 「小程序JAVA实战」小程序的flex布局(22)

    转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-22/ 之前已经把小程序的框架说完了,接下来说说小程序的组件,在说组件之前,先说说布局吧.源码:ht ...

  2. 「小程序JAVA实战」小程序的留言和评价功能(70)

    转自:https://idig8.com/2018/10/28/xiaochengxujavashizhanxiaochengxudeliuyanhepingjiagongneng69/ 目前小程序这 ...

  3. 「小程序JAVA实战」小程序的举报功能开发(68)

    转自:https://idig8.com/2018/09/25/xiaochengxujavashizhanxiaochengxudeweixinapicaidancaozuo66-2/ 通过点击举报 ...

  4. 「小程序JAVA实战」小程序的个人信息作品,收藏,关注(66)

    转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudegerenxinxizuopinshoucangguanzhu65 ...

  5. 「小程序JAVA实战」小程序的关注功能(65)

    转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudeguanzhugongneng64/ 在个人页面,根据发布者个人和 ...

  6. 「小程序JAVA实战」小程序的视频点赞功能开发(62)

    转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudeshipindianzangongnengkaifa61/ 视频点 ...

  7. 「小程序JAVA实战」小程序的springboot后台拦截器(61)

    转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudespringboothoutailanjieqi60/ 之前咱们把 ...

  8. 「小程序JAVA实战」小程序首页视频(49)

    转自:https://idig8.com/2018/09/21/xiaochengxujavashizhanxiaochengxushouyeshipin48/ 视频显示的内容是视频的截图,用户的头像 ...

  9. 「小程序JAVA实战」小程序视频封面处理(48)

    转自:https://idig8.com/2018/09/16/xiaochengxujavashizhanxiaochengxushipinfengmianchuli47/ 截图这块,在微信小程序工 ...

  10. 「小程序JAVA实战」小程序上传短视频(46)

    转自:https://idig8.com/2018/09/14/xiaochengxujavashizhanxiaochengxushangchuanduanshipin45/ 个人信息:用户上传短视 ...

随机推荐

  1. visualvm监控jvm及远程jvm监控方法

    VisualVM是Sun的一个OpenJDK项目,其目的在于为Java应用创建一个整套的问题解决工具.它集成了多个JDK命令工具的一个可视化工具,它主要用来监控JVM的运行情况,可以用它来查看和浏览H ...

  2. 关于Object类的equals方法和hashCode方法

    关于Object类的equals的特点,对于非空引用: 1.自反性:x.equals(x) return true : 2.对称性:x.equals(y)为true,那么y.equals(x)也为tr ...

  3. 在Ubuntu 14.04 TLS下openvas V8.0源代码安装过程

    [Qboy原创]详细记录源代码的安装过程 1.下载原代码 在http://www.openvas.org/install-source.html下载 Libraries 8.0.8 Scanner 5 ...

  4. 【SQL查询】合并多个数据集_union

    SQL UNION 操作符 UNION 操作符用于合并两个或多个 SELECT 语句的结果集. 请注意,UNION 内部的 SELECT 语句必须拥有相同数量的列.列也必须拥有相似的数据类型.同时,每 ...

  5. Java 使用 long 出现空指针异常

    p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px 'Helvetica Neue'; color: #454545} p.p2 {margin: ...

  6. android安装apk

     * 安装apk */ private void installApk() { // 获取当前sdcard存储路径 File apkfile = new File(Environment.getE ...

  7. poj2378(dfs,树形dp)

    和poj3107,poj1655一样的方法 #include<iostream> #include<cstdio> #include<cstdlib> #inclu ...

  8. 9.proc目录下的文件和目录详解

    1./proc目录下的文件和目录详解 /proc:虚拟目录.是内存的映射,内核和进程的虚拟文件系统目录,每个进程会生成1个pid,而每个进程都有1个目录. /proc/Version:内核版本 /pr ...

  9. 通过ssh限制ip访问

    方法:在/etc/hosts.allow中加入允许的ip,并禁止其他ip sshd:192.168.1.22:allow sshd:ALL:deny 不需要修改/etc/hosts.deny

  10. BigDecimal的用法

    一.简介 Java在java.math包中提供的API类BigDecimal,用来对超过16位有效位的数进行精确的运算.双精度浮点型变量double可以处理16位有效数.在实际应用中,需要对更大或者更 ...