1、全局组件的导入2、表单的校验template el-form :modelform refformRef :rulesrules label-width100px el-form-item propaccount label账户 el-input v-modelform.account/el-input /el-form-item el-form-item label密码 proppassword el-input v-modelform.password/el-input /el-form-item el-form-item el-button typeprimary clicksubmitForm提交/el-button /el-form-item /el-form /template script setup import { reactive ,ref} from vue const form reactive({ account: , password: }) const formRef ref(null) const rules { account: [ { required: true, message: 用户名不能为空, trigger: blur }, ], password: [ { required: true, message: 密码不能为空, trigger: blur }, { min: 6, message: 最小为6位, trigger: blur }, ] } const submitForm () { formRef.value.validate((valid) { if (valid) { // 验证通过在这里写提交接口请求 console.log(表单验证通过, form) alert(提交成功) } else { console.log(表单验证失败) return false } }) } /script