在 Vue 中,常用的事件有以下几种:
- @click:响应鼠标点击事件;
- @mouseover:响应鼠标移动到元素上方事件;
- @keydown:响应键盘按下事件;
- @submit:响应表单提交事件;
- @focus:响应元素获得焦点事件;
- @blur:响应元素失去焦点事件;
- @change:响应输入框内容变化事件;
- @scroll:响应元素滚动事件。
使用方法:
- 绑定事件:使用 @ 符号加事件名称,例如 @click;
- 在 Vue 实例中定义处理事件的方法,例如 onClick;
- 在实例中使用 methods 属性,将方法绑定到事件上。
示例代码:
<template> <div @click="onClick">点击我</div> </template> <script> export default { methods: { onClick() { console.log('点击事件触发'); }, }, }; </script>