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来控制和处理表单的交互，而不会触发浏览器默认的表单提交动作。