学习vue第七天-事件

本文详细介绍了Vue.js中使用v-on指令监听DOM事件的方法,包括鼠标事件修饰符如阻止冒泡、默认行为和多次触发,以及键盘事件监听和表单输入的双向绑定。还涵盖了v-model的用法,以及单选/多选组件的绑定和修饰符应用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

在这里插入图片描述
事件监听:
使用v-on指令监听DOM事件:v-on:/@
在这里插入图片描述
在这里插入图片描述

鼠标事件修饰符:
事件冒泡:触发内层元素的事件的同时,外层元素事件也被触发了
1.阻止事件冒泡
@click.stop
2.阻止默认行为
@click.prevent
3.点击事件只触发一次
@click.once

键盘事件:
监听按键
v-on:keyup(keyup:按下键盘抬起时触发)
v-on:keyup.enter(监听回车符)
v-on:keyup.delete(监听删除/退格键)

1.表单输入绑定
在这里插入图片描述
在这里插入图片描述

v-model实现双向绑定

2.单选/多选的绑定
3.修饰符
trim:自动过滤首尾输入的空白
number:自动转为数值类型

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值