preventDefault在Vue中的应用

在Vue中，preventDefault通常用于阻止默认的事件行为。例如，在一个表单提交事件中，可以使用preventDefault来阻止表单的默认提交行为，而改为使用Vue来处理表单数据的提交。示例代码如下：

<template>   <form @submit="handleSubmit">     <input type="text" v-model="formData.username">     <input type="password" v-model="formData.password">     <button type="submit">Submit</button>   </form> </template>  <script> export default {   data() {     return {       formData: {         username: '',         password: ''       }     };   },   methods: {     handleSubmit(event) {       event.preventDefault(); // 阻止默认的表单提交行为        // 在这里处理表单数据的提交逻辑     }   } }; </script> 

在上面的示例中，当用户点击提交按钮时，handleSubmit方法会被调用，并且传入event参数。通过调用event.preventDefault()方法，可以阻止表单的默认提交行为，然后在handleSubmit方法中处理表单数据的提交逻辑。这样就可以使用Vue来控制和处理表单的交互，而不会触发浏览器默认的表单提交动作。