微信小程序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. Seven-segment Display 贪心选择,快速判断能否有解

    https://csacademy.com/contest/round-39/task/seven-segment-display/ 可以知道,只有1是无解 而且肯定是选出来的位数约小越好. 位数 = ...

  2. RabbitMQ使用教程(三)如何保证消息99.99%被发送成功?

    1. 前情回顾 RabbitMQ使用教程(一)RabbitMQ环境安装配置及Hello World示例 RabbitMQ使用教程(二)RabbitMQ用户管理,角色管理及权限设置 在以上两篇博客发布后 ...

  3. easyUI 鼠标悬停某行提示

      最近参与公司的电子档案系统的开发,需求是需要用户鼠标悬停某一行时,需要根据后台业务数据进行提示. 档案系统开发采用的框架是struts2+mybatis+spring+easyUI开发,而前端的e ...

  4. SpringBoot | 第二十六章:邮件发送

    前言 讲解了日志相关的知识点后.今天来点相对简单的,一般上,我们在开发一些注册功能.发送验证码或者订单服务时,都会通过短信或者邮件的方式通知消费者,注册或者订单的相关信息.而且基本上邮件的内容都是模版 ...

  5. 解决ie9以及以下console未定义

    页面明明已经删除了所有的console,但是ie9下依旧会报错 console未定义 只能这样解决了 window.console = window.console || (function () { ...

  6. 运用CSS3媒体查询判断iPhoneX、iPhoneXR、iPhoneXS MAX及横竖屏

    //iphoneX.iphoneXs @media only screen and (device-width: 375px) and (device-height: 812px) and (-web ...

  7. Angular ui-route介绍

    参考博客: https://www.cnblogs.com/haogj/p/4885928.html 原文地址:http://www.ng-newsletter.com/posts/angular-u ...

  8. 如何查看与显示oracle表的分区信息

    显示分区表信息 显示数据库所有分区表的信息:DBA_PART_TABLES 显示当前用户可访问的所有分区表信息:ALL_PART_TABLES 显示当前用户所有分区表的信息:USER_PART_TAB ...

  9. mac 查看python安装路径

    1.terminal : input: which Python 2.terminal: input : python  --->import sys  ----> print sys.p ...

  10. 在MVC中使用NHibernate学习记录

    NHibernate简介: NHibernate是一个面向.net环境的对象/关系数据库映射工具,对象/关系数据库映射(object/relational mapping,ORM)是一种技术,可以将对 ...