「小程序JAVA实战」 小程序的事件(11)
转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-11/
我们以前在web开发的时候,web页面也有一些相关的事件,当然小程序要接触屏幕要进行一些点击和拖动事件。源码:https://github.com/limingios/wxProgram.git 中的No.6
小程序的事件触发
通过行为进行的人机交互方式
类似于html的onClick,onChange事件等等
- 官方的阐述
>https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxml/event.html


- 程序演示点击
//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>


- 数据传递
>通过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)的更多相关文章
- 「小程序JAVA实战」小程序的flex布局(22)
转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-22/ 之前已经把小程序的框架说完了,接下来说说小程序的组件,在说组件之前,先说说布局吧.源码:ht ...
- 「小程序JAVA实战」小程序的留言和评价功能(70)
转自:https://idig8.com/2018/10/28/xiaochengxujavashizhanxiaochengxudeliuyanhepingjiagongneng69/ 目前小程序这 ...
- 「小程序JAVA实战」小程序的举报功能开发(68)
转自:https://idig8.com/2018/09/25/xiaochengxujavashizhanxiaochengxudeweixinapicaidancaozuo66-2/ 通过点击举报 ...
- 「小程序JAVA实战」小程序的个人信息作品,收藏,关注(66)
转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudegerenxinxizuopinshoucangguanzhu65 ...
- 「小程序JAVA实战」小程序的关注功能(65)
转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudeguanzhugongneng64/ 在个人页面,根据发布者个人和 ...
- 「小程序JAVA实战」小程序的视频点赞功能开发(62)
转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudeshipindianzangongnengkaifa61/ 视频点 ...
- 「小程序JAVA实战」小程序的springboot后台拦截器(61)
转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudespringboothoutailanjieqi60/ 之前咱们把 ...
- 「小程序JAVA实战」小程序首页视频(49)
转自:https://idig8.com/2018/09/21/xiaochengxujavashizhanxiaochengxushouyeshipin48/ 视频显示的内容是视频的截图,用户的头像 ...
- 「小程序JAVA实战」小程序视频封面处理(48)
转自:https://idig8.com/2018/09/16/xiaochengxujavashizhanxiaochengxushipinfengmianchuli47/ 截图这块,在微信小程序工 ...
- 「小程序JAVA实战」小程序上传短视频(46)
转自:https://idig8.com/2018/09/14/xiaochengxujavashizhanxiaochengxushangchuanduanshipin45/ 个人信息:用户上传短视 ...
随机推荐
- Easyui 行编辑
之前没用过,突然用了的时候手忙脚乱的感觉 找了官方文档也好 百度了一大堆东西 表示个人脑袋跟不上思路 直接铺上简化的 以后自己 找起来也方便 以下代码已经执行 应该不会再错了 <tab ...
- PowerDesigner 概念数据模型
(转自:http://www.cnblogs.com/yxonline/archive/2007/04/09/705479.html) 目标:本文主要介绍PowerDesigner中概念数据模型 CD ...
- vue: data binding
1.文本 第一种“Mustache” 语法(双大括号)写法第二种 用v-text的指今写法第三种和第四是对es6写法的拓展写法,称模板字符串 <template> <div> ...
- Go开发Struct转换成map两种方式比较
最近做Go开发的时候接触到了一个新的orm第三方框架gorose,在使用的过程中,发现没有类似beego进行直接对struct结构进行操作的方法,有部分API是通过map进行数据库相关操作,那么就需要 ...
- 第二章 Linux目录介绍
一级目录 /bin (普通用户)二进制命令所在目录 备注 /boot LINUX内核及系统引导程序所需的文件目录 常见分区:128M swap内存的1.5倍 /dev 设备文件的目录 比如声卡.磁盘. ...
- 修改CentOS7网卡名称为传统名称eth0格式
1.调整网卡名称 进入网卡目录```[root@tools]# cd/etc/sysconfig/network-scripts/``` 修改名称```[root@network-scripts]# ...
- C++之内存管理
内存管理是C++最令人切齿痛恨的问题,也是C++最有争议的问题,C++高手从中获得了更好的性能,更大的自由,C++菜鸟的收获则是一遍一遍的检查代码和对C++的痛恨,但内存管理在C++中无处不在,内存泄 ...
- 高级C/C++编译技术之读书笔记(四)之定位库文件
最近有幸阅读了<高级C/C++编译技术>深受启发,该书深入浅出地讲解了构建过程(编译.链接)中的各种细节,从多个角度展示了程序与库文件或代码的集成方法,提出了面向代码复用和系统集成的软件架 ...
- 关于fpga的m9k的部分理解
1.控制信号包括时钟使能,读写使能,字节使能,地址使能,异步清零等 2.可配置为单端口,简单双端口,真双端口,fifo,rom,移位寄存器. 3.关于移位寄存器模式的介绍如下: 一个 ( w × m ...
- Angular2使用boostrap和ng-bootstrap总结
Angular2使用bootstrap有几种方式,本文主要介绍两种方式进行Boostrap样式的使用: 一.直接通过静态文件的方式进行引入: 通过命令新建一个Bootstrap的工程 ng new B ...