主要在 this.$refs[formName].validate() 这里报错,我打印了下this.$refs看看里面有什么,结果是这样的:

先上代码看看:
1. <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class='form' label-width="80px">
2. <el-form-item label="账号"
3. prop="name"
4. >
5. <el-input v-model="ruleForm.name"></el-input>
6. </el-form-item>
7. <el-form-item label="密码"
8. prop="password"
9. >
10. <el-input v-model="ruleForm.password"></el-input>
11. </el-form-item>
12. <el-form-item label="验证码"
13. prop="code"
14. >
15. <el-input v-model="ruleForm.code"></el-input>
16. </el-form-item>
17. <el-form-item>
18. <el-button type="primary" @click="onSubmit(ruleForm)">登录</el-button>
19. </el-form-item>
20. /el-form>
1. data () {
2. return {
3. code: '', // 验证码svg
4. ruleForm: {
5. name: '', // 用户名
6. password: '', // 密码
7. code: '' // 验证码
8. },
9. rules: {
10. name: [
11. { required: true, message: '请输入账号', trigger: 'blur' }
12. ],
13. password: [
14. { required: true, trigger: 'blur', message: '请输入密码' }
15. ],
16. code: [
17. { required: true, trigger: 'blur', message: '请输入验证码' }
18. ]
19. }
20. }
21. },
22. methods: {
23. onSubmit (ruleForm2) {
24. this.$refs.ruleForm.validate((valid) => {
25. if (valid) {
26. console.log(valid)
27. } else {
28. console.log('error submit!!')
29. return false
30. }
31. })
32. },
33. }