uni-app 事件

定义事件

• 第一步：注册事件 @click="handleClick"
• 第二步：定义事件监听函数，需要在"methods"中定义 （即事件回调）
• 第三步：事件的传参

Demo

<template>
    <view class="content">
        <!-- 1. 为view标签绑定点击事件-->
        <view @click="handleClick">Click</view>
    </view>
</template>

<script>
    export default {
        // 2. 在methods中定义事件的回调
        methods: {
            handleClick() {
                console.log("Hello World.");
            }
        }
    }
</script>

事件传参

<template>
	<view class="content">
		<!-- 1. 为view标签绑定点击事件-->
		
		<view @click="handleClick(1)">Click1</view>
		<view @click="handleClick(2)">Click2</view>
		
		<!-- $event是固定写法，事件源，用于传参自定义参数-->
		<view data-index="11" @click="handleClickSecond(1, $event)">Click DIY</view>
	</view>
</template>

<script>
	export default {
		// 2. 在methods中定义事件的回调
		methods: {
			handleClick(event) {
				console.log(event);
			},
			handleClickSecond(a,event) {
				console.log(a);
                console.log(event);
				console.log(event.currentTarget.dataset.index);
			},
		}
	}
</script>

第一种：无参调用

第二种：参数类型固定

第三种：参数是自定义的