我需要一段VUE3表单验证的代码
时间: 2024-05-19 21:15:07 浏览: 84
当然可以,以下是一个基本的VUE3表单验证代码示例:
<template>
<form @submit.prevent="submitForm">
<label>
Email:
<input type="email" v-model="userEmail" required>
</label>
<br>
<label>
Password:
<input type="password" v-model="userPassword" minlength="8" required>
</label>
<br>
<button type="submit">Submit</button>
</form>
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
const userEmail = ref('')
const userPassword = ref('')
const submitForm = () => {
if (!validateEmail(userEmail.value)) {
alert('Please enter a valid email address')
} else if (!validatePassword(userPassword.value)) {
alert('Password must be at least 8 characters long')
} else {
// submit form data
}
}
const validateEmail = (email) => {
// email validation logic
}
const validatePassword = (password) => {
// password validation logic
}
return {
userEmail,
userPassword,
submitForm
}
}
}
</script>
希望能帮到您。
阅读全文