vue表单添加事件

在form第一个便签里加上 @submit 属性,后面跟上执行的函数,
例如:

  1. <form @submit="login">
  2. <div class="mb-3">
  3. <label for="username" class="form-label">Username</label>
  4. <input v-model="username" type="text" class="form-control" id="username">
  5. </div>
  6. <div class="mb-3">
  7. <label for="password" class="form-label">Password</label>
  8. <input v-model="password" type="password" class="form-control" id="password">
  9. </div>
  10. <div class="error-message">{{ errorMessage }}</div>
  11. <button type="submit" class="btn btn-primary">Submit</button>
  12. </form>

如果需要禁用掉默认事件可以用 @submit.prevent 例如:

  1. <form @submit.prevent="login">
  2. <div class="mb-3">
  3. <label for="username" class="form-label">Username</label>
  4. <input v-model="username" type="text" class="form-control" id="username">
  5. </div>
  6. <div class="mb-3">
  7. <label for="password" class="form-label">Password</label>
  8. <input v-model="password" type="password" class="form-control" id="password">
  9. </div>
  10. <div class="error-message">{{ errorMessage }}</div>
  11. <button type="submit" class="btn btn-primary">Submit</button>
  12. </form>
添加新评论