Vue 문서에서 입력 상자 캐리지 리턴 이벤트 및 확인 기능을 사용하는 방법

<template>
  <div>
    <input v-model="content" @keydown.enter="submitForm">
    <button @click="submitForm">提交</button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      content: ''
    }
  },
  methods: {
    submitForm() {
      // 提交表单代码
    }
  }
}
</script>

<template>
  <div>
    <input v-model="username" @blur="checkUsername">
    <input v-model="password" @blur="checkPassword">
    <button @click="submit">提交</button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      username: '',
      password: '',
      usernameError: '',
      passwordError: ''
    }
  },
  methods: {
    checkUsername() {
      if (!this.username) {
        this.usernameError = '用户名不能为空';
      } else {
        this.usernameError = '';
      }
    },
    checkPassword() {
      if (!this.password) {
        this.passwordError = '密码不能为空';
      } else {
        this.passwordError = '';
      }
    },
    submit() {
      this.checkUsername();
      this.checkPassword();
      if (!this.usernameError && !this.passwordError) {
        // 提交表单代码
      }
    }
  }
}
</script>