小程序学习(一)

【微信小程序】事件绑定和事件对象 小程序中绑定事件与在网页开发中绑定事件几乎一致,只不过在小程序不能通过on的方式绑定事件,也没有click等事件,小程序中绑定事件使用bind方法,click事件也需要使用tap事件来进行代替bind:事件名bind事件名事件处理函数需要写到.js文件中,在 .js 文件中需要调用小程序提供的 Page 方法来注册小程序的页面,我们可以直接在 Page 方法中创建事件处理函数。 阅读详情
  1. bind事件绑定不会阻止冒泡事件向上冒泡,catch事件绑定可以阻止冒泡事件向上冒泡。

  2. 自基础库版本 1.5.0 起,触摸类事件支持捕获阶段。捕获阶段位于冒泡阶段之前,且在捕获阶段中,事件到达节点的顺序与冒泡阶段恰好相反。需要在捕获阶段监听事件时,可以采用capture-bind、capture-catch关键字,后者将中断捕获阶段和取消冒泡阶段。

  3. 事件对象:

    target:被点击的组件

    currentTarget:当前事件绑定的组件

  4.  在组件中可以定义数据,这些数据将会通过事件传递给 SERVICE。 书写方式: 以data-开头,多个单词由连字符-链接,不能有大写(大写会自动转成小写)如data-element-type,最终在 event.currentTarget.dataset 中会将连字符转成驼峰elementType。

    示例:

    <view data-alpha-beta="1" data-alphaBeta="2" bindtap="bindViewTap"> DataSet Test </view>

    Page({

      bindViewTap:function(event){

        event.currentTarget.dataset.alphaBeta === 1 // - 会转为驼峰写法

        event.currentTarget.dataset.alphabeta === 2 // 大写会转为小写

      }

    })

说明: target 和 currentTarget 可以参考上例中,点击 inner view 时,handleTap3 收到的事件对象 target 和 currentTarget 都是 inner,而 handleTap2 收到的事件对象 target 就是 inner,currentTarget 就是 middle。    

<view id="outer" bind:touchstart="handleTap1" capture-bind:touchstart="handleTap2">

  outer view

  <view id="inner" bind:touchstart="handleTap3" capture-bind:touchstart="handleTap4">

    inner view

  </view>

</view>

如果将上面代码中的第一个capture-bind改为capture-catch,将只触发handleTap2。

<view id="outer" bind:touchstart="handleTap1" capture-catch:touchstart="handleTap2">

  outer view

  <view id="inner" bind:touchstart="handleTap3" capture-bind:touchstart="handleTap4">

    inner view

  </view>

</view>

5. 小程序的生命周期函数

 

 

模块化:

module.exports = {

    loadInfo: loadInfo

}

注意: <block/> 并不是一个组件,它仅仅是一个包装元素,不会在页面中做任何渲染,只接受控制属性。

微信小程序总结(学习阶段一) 微信小程序总结 1.页面介绍: WXML模板:wxss书写样式,样式和css基本一样; wxml类似于之前的html书写页面结构 wxss类似于之前的css书写页面样式 sitemap和project.config.json属于配置文件 app.wxss全局样式 app.js配置文件 utils书写插件 app.json书写全局配置信息 https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html pa 阅读详情

相关推荐

小程序学习总结(一)

微信小程序是一种运行在微信内部的轻量级应用程序 在使用小程序时 不需要下载安装,用户扫一扫或搜一下即可打开应用。它体现了【用完即走】的理念,用户不用关心安装太多应用的问题。它实现了应用【触手可及】的梦想, 应用无处不在,随时可用,但又无需安装卸载

thinkers 712

【小程序教程】微信小程序之事件绑定

微信小程序的事件绑定是非常重要的一部分,它可以让我们的小程序与用户进行交互,实现各种功能,例如点击按钮、滑动页面、输入内容等等。通过本篇博文的介绍,我们了解了微信小程序事件绑定的基本语法和常用的事件类型,学会了如何编写事件处理函数、以及传参和阻止冒泡的方法。在微信小程序中,通过在标签上绑定事件,当用户进行某种操作时,该事件就会被触发,从而执行相应的代码逻辑。在事件绑定中,我们需要定义对应的事件处理函数,当事件被触发时,该函数就会执行。,可以用来获取事件的相关信息,例如。在上面的代码中,当用户点击。

4439

微信小程序学习日志(一)

微信小程序学习日志之工具配置及创建简单页面1.任务与分工在这次点餐系统项目中,我和我所在的小程序组的共三个成员主要负责小程序前端的实现。我们针对菜单,点菜清单(结算页面)以及评论三个主要页面进行了初步的实现。其中我负责的是评论页,需要实现的是展示出全部的客户的评价。这是我第一次参与小程序的项目,因此简单学习了一些关于微信小程序的前端实现的知识,在此简要记录下自己的经历与收获。2.开发者工具使用的学习

pomelo_W的博客 3088

微信小程序开发系列(十四)·事件绑定的两种方法以及如何读取事件对象

。第一种方式: bind:事件名, bind后面需要跟上冒号,冒号后面跟上事件名,例如: 第二种方式:bind事件名,bind 后面直接跟上事件名,例如:

时光の尘的博客 3876

PLC编程进阶:结构体(UDT)与功能块(FB)的模块化实践指南

本文深入探讨了PLC编程中实现模块化的核心方法,重点解析了结构体(UDT)与功能块(FB)的协同应用。通过将零散数据封装为UDT,并将控制逻辑打包为可复用的FB,能够构建出结构清晰、易于维护和调试的PLC程序。文章结合拧紧枪、电机控制等实战案例,提供了从设计原则到分层架构的完整实践指南,旨在帮助工程师将混乱的‘面条式’代码改造为高效的‘正规军’。

s3t4u的博客 219

QT实现串口通信

要实现串口通信,需要知道串口通信需要的信息 主要参数有:波特率、校验位、数据位、停止位、控制流 主要操作有:串口的打开和关闭、刷新设备串口、接发数据、开关显示灯等。 实现效果如图: 最后附赠完整源码。 第一步:在头文件中引入 QtSerialPort 类的两个头文件(必须引入) // 引入串口通信的两个头文件(第一步) #include <QtSerialPort/QSerialPort> // 提供访问串口的功能 #include <QtSerialPo

m0_49456900的博客 6万+

微信小程序开发---事件的绑定

本文主要介绍的是微信小程序开发中的事件绑定

gaoqiandr的博客 2243

保姆级教程:用ncnn把自训练的YOLOv8模型塞进Android App(附完整代码)

本文提供了一份详细的保姆级教程,指导开发者如何将自训练的YOLOv8模型通过ncnn框架部署到Android应用中。教程涵盖环境配置、模型训练与转换、Android工程集成及性能优化等全流程,并附完整代码实现,帮助开发者快速掌握移动端AI模型部署技术。

weixin_42659194的博客 254

【微信小程序入门到精通】— 事件绑定的详细解读

对于目前形式,微信小程序是一个热门,那么我们该如何去学习并且掌握之后去做实际项目呢?为此我特意开设此专栏,在我学习的同时也将其分享给大家!这一篇文章我们就涉及到事件绑定问题了,也就是我们小程序最重要的用户交互问题,我们是如何接收用户触发的信息并且处理的呢?这一篇文章将告诉你答案!如果在往下阅读的过程中,有什么错误的地方,期待大家的指点!大家每天都要开开心心的喔,让我们一起快乐的学习吧!

热爱生活,积极向上的阿酱! 6345

Cheat Engine实战:多级指针逆向破解游戏内存的5个关键步骤(附C++模拟代码)

本文详细解析了使用Cheat Engine进行多级指针逆向破解游戏内存的完整流程。通过5个关键步骤,从定位动态地址到逐层追踪指针链,最终构建稳定指针路径。文章结合C++模拟代码,深入剖析了指针链的底层汇编原理,并提供了高级排查技巧,帮助读者掌握逆向工程中的核心内存追踪技术。

weixin_29239279的博客 306

Spring Boot整合AWS S3文件上传实战:从配置到权限管理全流程解析

本文详细解析了Spring Boot整合AWS S3文件上传的全流程,包括基础配置、核心上传功能实现、高级权限控制及安全最佳实践。通过实战案例展示如何高效处理文件上传、大文件分片及权限管理,帮助开发者构建健壮的文件管理系统。特别强调AWS S3的高可用性和安全性,适用于企业级应用开发。

sam99的博客 283

微信小程序学习总结(一)

微信小程序学习总结(一) 微信小程序: 简称: 小程序,是一种不需要安装即可使用的应用 特点: 免安装 操作更接近原生APP 必须在微信中使用 不占内存 易传播 官方文档地址: https://developers.weixin.qq.com/miniprogram/dev/ 一.小程序目录结构: app.js 注册一个小程序 app.json 全局配置(窗口的表现, 网络超时...

山中何事的博客 2002

PCL 欧式聚类分割【2026最新版】

PCL中欧式聚类提取算法原理详解、代码实现以及一个大自然场景地物分割提取并保存分割结果到本地文件夹的应用案例。

点云侠的博客 40万+

微信小程序学习总结——①

微信小程序的学习日记

qq_45947850的博客 1058

[系统安全] 一.什么是逆向分析、逆向分析基础及经典扫雷游戏逆向

娜璋AI安全之家于2020年8月18日开通,将专注于Python和安全技术,主要分享Web渗透、系统安全、CVE复现、威胁情报分析、人工智能、大数据分析、恶意代码检测等文章。真心想把自己近十年的所学所做所感分享出来,与大家一起进步。 系统安全系列作者将深入研究恶意样本分析、逆向分析、攻防实战等,通过在线笔记和实践操作的形式分享与博友们学习,希望能与您一起进步。第一篇文章先带领大家学习什么是逆向分析,然后详细讲解逆向分析的典型应用,接着通过OllyDbg工具逆向分析经典的游戏扫雷,再通过Cheat Engin

杨秀璋的专栏 2万+

如何在 FPGA 中做数学运算

FPGA 非常适合进行数学运算,但是需要一点技巧,所以我们今天就看看如何在 FPGA 中进行简单和复杂的数学运算。介绍由于FPGA可以对算法进行并行化,所以FPGA 非常适合在可编程逻辑中实现数学运算。我们可以在 FPGA 中使用数学来实现信号处理、仪器仪表、图像处理和控制算法等一系列应用。这意味着 FPGA 可用于从自动驾驶汽车图像处理到雷达和飞机飞行控制系统的一系列应用。因为 FPGA 寄存器...

OpenFPGA的博客 2913

微信小程序学习笔记(阶段一)

一阶段学习过程:   (一)看官方文档的简易教程:https://mp.weixin.qq.com/debug/wxadoc/dev/   (二)看小码哥视频:https://chuanke.baidu.com/v2040981-197486-1133724.html   (三)模仿并写出一个计算器小程序demo 项目结构:   pages:存储这各个页面的文件夹   pages...

weixin_30615767的博客 125

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

微信小程序学习 -- 一、小程序简介

目录前言一、小程序简介1、小程序与普通网页开发的区别2、小程序代码的构成 - 项目结构(1)基本组成结构(2) 小程序页面的组成部分(3)JSON 配置文件(4)WXML模板(5)WXSS样式(6).js文件3、小程序的宿主环境(1)通信模型(2)运行机制(3)组件(4)API 前言 能够知道如何创建小程序项目 能够清楚小程序项目的基本组成结构 能够知道小程序页面由几部分组成 能够知道小程序中常见的组件如何使用 能够知道小程序如何进行协同开发和发布 一、小程序简介 1、小程序与普通网页开发的区别

ljn1046016768的博客 4474

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

计算机控制技术及应用

《计算机控制技术及应用》通过总结作者的科研成果和吸收国内外的先进理论、方法和技术,以计算机控制系统的网络化、开放化、智能化和集成化发展趋势为主线索,主要介绍计算机控制系统的基本概念和计算机控制系统的典型形式,计算机控制系统的数学描述与基本分析方法,以及数字PID控制器、最少拍控制系统、达林算法、状态变量设计法等设计方法及其各种改进算法。重点突出计算机控制系统输入输出通道接口的设计方法和典型控制系统的设计案例与实现方法等。

关于小程序的学习(一)

为什么要持续学习呢? 大学之道,在明明德,在亲民,在止于至善。知止而后有定,定而后能静,静而后能安,安而后能虑,虑而后能得。物有本末,事有终始,知所先后,则近道矣。 男人的极大幸运在于,他,不论在成年还是在小时候,必须踏上一条极为艰苦的道路,不过这是一条最可靠的道路;女人的不幸则在于被几乎不可抗拒的诱惑包围着;她不被要求奋发向上,只被鼓励滑下去到达极乐。当她发觉自己被海市蜃楼愚弄时,已经为时太晚,...

hello250sunshine的博客 508

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android:LinePhone3.2.7(最新版本),官网地址:http://www.linphone.org/

我在学习小程序 (一)

这里记录的是我在学习小程序的内容。

m0_65872420的博客 191

微信小程序学习(一)

首先呢先做一些必须要做的事情,虽然我本人不喜欢这些东西,但是这些东西没有还是不行的,避免以后找不到就写详细点,以后留给朋友看一看也蛮好的… 1.小程序简介 小程序是一种不需要下载、安装即可使用的应用,它出现了触手可及的梦想,用户扫一扫或者搜一下即开打开应用,也出现了用完即走的理念,用户不用关心安装太多应用的问题,应用随处可用,但又无须安装卸载。我当时是这样来定义什么是小程序的。 1:无需下载...

Strugglein的博客 7480

微信小程序深入学习一

一、配置小程序 一个小程序主体部分由三个文件组成: app.js、app.json、app.wxss 一个小程序页面由四个文件组成: js、wxml、json、wxss 页面全局配置app.js 页面局部配置.json { 设置标签背景颜色 "navigationBarBackgroundColor": "#ffffff", 设置标签文字颜色 "navigationBarTextS...

weixin_44439110的博客 351

小程序学习系列一

今天主要学习我们开发的小程序,在微信开发者工具上传之后,到底变成了什么样,今天主要解决一下几个问题 1)通过开发者工具上传之后,最后在微信端运行是什么文件 第一步:安装模拟器 第二步:登录微信体验小程序 第三步: 选择压缩所选文件 第四步:将压缩的zip文件发送到微信 本文总结 通过本次验证,我们发现在微信运行的小程序应用文件扩展名wxapkg 本文完 ...

weixin_47395694的博客 306

安卓开发学习小程序一

一直想静下心来,学习一下小程序的开发,写个东西练练手。但是看文档还有搜索文章的时候,确实是觉得一头雾水,一脸懵逼。估计也是有些心急,想直接就上手写项目,但是比较是作为移动端的开发者去写小程序,肯定还是需要静下心来,好好学习一个文档。此文就作为一个记录,记录自己的学习过程。 ...

weixin_37166398的博客 936
上一篇: 浅谈CSS3中display属性的Flex布局
下一篇: 小程序学习(二)
小桃酥
博客等级 码龄10年 23粉丝 57原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值