//原生组件不支持下边这两个事件绑定方式
当前位置:   article > 正文

WeChat applet 微信小程序(3) 事件绑定_小程序中bindtap和tap的区别

小程序中bindtap和tap的区别

WeChat applet 事件绑定

  • 概述

事件是视图层到逻辑层的通讯方式,事件可以将用户的行为反馈到逻辑层进行处理。

事件可以绑定到组件,当用户在视图层触发该组件的事件时,就会执行逻辑层中对应的事件处理函数。

  • 事件列表
    在这里插入图片描述
  • 事件绑定

事件处理函数书写在page.js中,可以带有event参数(代表事件对象)

<componentName bind事件名称="事件处理函数名称"></componentName>
//原生组件不支持下边这两个事件绑定方式
<componentName bind:事件名称="事件处理函数名称"></componentName>
//catch会阻止事件冒泡
<componentName catch事件名称="事件处理函数名称"></componentName>
<componentName catch:事件名称="事件处理函数名称"></componentName>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

原生组件指的是客户端创建组件,原生组件中不支持bind:事件名称绑定方式
如input、textarea等只能使用bind事件名称的方式

tap 轻敲(触屏后立即离开)
longtap (触屏350ms后离开)
longpress (触屏350ms后离开)

longtap 和 longpress 的区别
当同时添加 tap&longtap tap&longpress
longtap会触发tap,longpress不会触发tap

bindbind:不会阻止事件冒泡;catchcatch:会阻止事件冒泡

无论哪一种事件绑定方式,在组件的事件处理函数严禁带有小括号
如何进行数据的传递???

  • 事件处理函数
    对比vue.js 和 小程序.js

vue.js

<template>
	<div>
		<button @click="getById(5)">单击获取5号商品信息</button>
	</div>
</template>
<script>
export default{
   
	data(){
   
		return{
   
		//...
		//...
		}
	},
	methods:{
   
		getById(id
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/笔触狂放9/article/detail/218940
推荐阅读
相关标签