微信小程序js学习心得体会

页面控制的bindtap和catchtap

用法,区别

<button id='123' data-userDate='100' bindtap='tabMessage'>刷新</button>
tabMessage: function(e){
console.log(e.target.id); console.log(e.target.dataset); console.log(e.target.dataset.userdate);
},
  • 可以获取的数据

    • id
    • 设置的datauserxxx,在页面上设置为data-userXxxx,在js中获取则为dataset.userxxxx 更换为小写
  • bindtap 与 catchtap的是否冒泡的区别
    • bindtap为冒泡事件,bindtap会导致上级控件的所有事件被触发,而catchtap不会
    • catchtap可以中断冒泡事件
    • 任何控件都可以添加该事件
    • 因此通常会在最外层使用一个view作为总控件,添加一个bindtap执行如全局刷新等功能

setData

对于小程序中存在js中data的初始数据,假设如下

data: {
count: 1,
weeek: 1 },
view1: function(e){
this.setData({
count: 2
})
}

在这个js中,如果执行view1函数,则data数据只有count会改变,而week不会改变,不会受到影响。

微信小程序js学习心得体会的更多相关文章

  1. 微信小程序入门学习

    前(che)言(dan): 近几天,微信小程序的内测引起了众多开发人员的热议,很多人都认为这将会成为一大热门,那么好吧,虽然我是一个小白,但这是个新玩意,花点时间稍稍钻研一下也是无妨的,谁让我没有女朋 ...

  2. 微信小程序开发学习资料

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

  3. 微信小程序入门学习-- 简易Demo:计算器

    简单学习下微信小程序 官网 简易教程 · 小程序 https://mp.weixin.qq.com/debug/wxadoc/dev/ 需要通过开发者工具,来完成小程序创建和代码编辑. 下载安装,运行 ...

  4. 微信小程序 JS动态修改样式

    微信小程序这个坑啊,js动态修改样式,我们并不能用js或者jq 轻轻松松一行代码搞定.或者用removeClass addClass 来修改样式. 以下是一种动态修改样式的方法,原理是绑定数据,然后动 ...

  5. 微信小程序初使心得【微信小程序快速入门】

    摘要: 2016年推出微信小程序,时至今日,历经几个版本的更新,已形成了相对实用和稳定的服务平台.本文简单的介绍了微信小程序的入门用法,今后会继续关注和实践. 2016年推出微信小程序,时至今日,历经 ...

  6. “微信小程序” js部分注解

    1.小程序不提供获取dom的操作,而是让我们直接将事件绑定写入到组件内.区别在于bind不阻止冒泡,而catch阻止冒泡. <view id="tapTest" bindta ...

  7. 微信小程序组件学习 -- 注册页面

    微信小程序组件使用手册地址: 1. 百度搜索"微信公众平台",扫码登录之后,点击帮助文档里面的普通小程序. 2. 接着选择"开发"-->"组件& ...

  8. 微信小程序开发学习(一):开发前准备

    开发前准备 Step1:注册 微信小程序开放平台: https://mp.weixin.qq.com/cgi-bin/wx 开发者注册: https://mp.weixin.qq.com/wxopen ...

  9. 第1-5章 慕课网微信小程序开发学习笔记

    第1章 前言:不同的时代,不同的Web --微信小程序商城构建全栈应用 http://note.youdao.com/noteshare?id=a0e9b058853dbccf886c1a890594 ...

随机推荐

  1. maven参数

    mvn clean package -DskipTests mvn -T 2 clean install/mvn -T 2C clean install: maven支持并行构建,-T 2表示使用2个 ...

  2. QueueUtil

    import com.rabbitmq.client.Connection; import com.rabbitmq.client.ConnectionFactory; import org.slf4 ...

  3. jquery——事件冒泡、事件委托

    一个事件冒泡的例子: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  4. 使用freemarker生成html、doc文件【原创】

    语言:java 功能:使用freemarker生成html.doc 1.生成html public void updateuseFreemarker2html(String abdkId) { // ...

  5. 你一直在用的 Spring Boot Starters 究竟是怎么回事

    Spring Boot 对比 Spring MVC 最大的优点就是使用简单,约定大于配置.不会像之前用 Spring MVC 的时候,时不时被 xml 配置文件搞的晕头转向,冷不防还因为 xml 配置 ...

  6. AssetDatabase的方法总结

    AssetDatabase的方法总结 1.AssetDatabase.FindAssets public static string[] FindAssets(string filter);publi ...

  7. php函数超实用

    DateTime DateTime::addDateTime::diffDateTime::formatDateTime::modifyDateTime::sub... * DateInterval ...

  8. Centos7搭建redis,同一服务器启动两个端口的redis

    1.安装redis [1]下载安装包 #准备安装文件夹 mkdir /usr/local/soft/redis #进入文件夹 cd /usr/local/soft/redis #下载安装包 wget ...

  9. Freetype 安装时提示 make: Nothing to be done for `unix'

    [Software-Freetype] Freetype 安装时提示 make: Nothing to be done for `unix' 官网下载的第三方软件包,编译安装会报以下错误,解决办法如下 ...

  10. Ionic 解决gradle下载慢的问题

    问题 使用Ioinc添加安卓平台或者编译的时候,提示gradle-XXX-all.zip下载,此进度缓慢. 解决 下载gradle对应的zip文件. 参考资源:http://services.grad ...