小伙伴们，此文一起学学 @submit.prevent 指令吧～
@submit.prevent 是 Vue.js 中用于处理表单提交事件的指令。它是 Vue 模板语法的一部分，结合了事件监听和事件修饰符的功能。
1. 具体含义：
1.1. @submit：这是 Vue 的事件监听语法，等同于原生 JavaScript 的 addEventListener('submit', ...)。它监听表单的 submit 事件。
1.2. .prevent：这是 Vue 的事件修饰符，等同于在事件处理函数中调用 event.preventDefault()。它会阻止表单的默认提交行为（即阻止页面刷新或跳转）。
2. 使用场景：
在 Vue.js 中，通常使用 @submit.prevent 来处理表单提交，避免页面刷新，同时执行自定义的提交逻辑（例如发送异步请求）。
示例代码：
<script>
export default {
data() {
return {
username: '' // 绑定输入框的值
};
},
methods: {
handleSubmit() {
// 自定义的提交逻辑
console.log('提交的用户名是:', this.username);
// 这里可以发送异步请求，例如调用 API
}
}
};
</script>
代码解析：
@submit.prevent="handleSubmit"：
- 监听表单的 submit 事件。
- 使用 .prevent 阻止表单的默认提交行为（页面刷新）。
- 当表单提交时，调用 handleSubmit 方法。
v-model="username"：
- 将输入框的值与 Vue 组件的 username 数据属性双向绑定。
handleSubmit 方法：
- 在这里可以编写自定义的提交逻辑，例如验证表单数据、发送异步请求等。
3. 其他常用事件修饰符：
- .stop：阻止事件冒泡（等同于 event.stopPropagation()）。
- .capture：使用事件捕获模式。
- .self：只有当事件是从元素本身触发时才触发回调。
- .once：事件只触发一次。
4. 做一下小结：
@submit.prevent 是 Vue.js 中处理表单提交的常用方式，能够避免页面刷新，同时实现自定义的提交逻辑。它是 Vue 事件系统和模板语法的重要组成部分。
好了，爱学习的小伙伴，关注不迷路哟～