improve form validate docs

examples/docs/en-US/form.md

@@ -2,8 +2,9 @@
   export default {
     data() {
       var checkAge = (rule, value, callback) => {
-        var age = parseInt(value, 10);
-
+        if (!value) {
+          return callback(new Error('Please input the age'));
+        }
         setTimeout(() => {
           if (!Number.isInteger(age)) {
             callback(new Error('Please input digits'));
@@ -110,16 +111,13 @@
         },
         rules2: {
           pass: [
-            { required: true, message: 'Please input the password', trigger: 'blur' },
-            { validator: validaePass }
+            { validator: validaePass, trigger: 'blur' }
           ],
           checkPass: [
-            { required: true, message: 'Please input the password again', trigger: 'blur' },
-            { validator: validaePass2 }
+            { validator: validaePass2, trigger: 'blur' }
           ],
           age: [
-            { required: true, message: 'Please input the age', trigger: 'blur' },
-            { validator: checkAge, trigger: 'change' }
+            { validator: checkAge, trigger: 'change', trigger: 'blur' }
           ]
         },
         dynamicForm: {
@@ -645,8 +643,9 @@ Form component allows you to verify your data, helping you find and correct erro
   export default {
     data() {
       var checkAge = (rule, value, callback) => {
-        var age = parseInt(value, 10);
-
+        if (!value) {
+          return callback(new Error('Please input the age'));
+        }
         setTimeout(() => {
           if (!Number.isInteger(age)) {
             callback(new Error('Please input digits'));
@@ -656,10 +655,10 @@ Form component allows you to verify your data, helping you find and correct erro
             } else {
               callback();
             }
-          } 
+          }
         }, 1000);
       };
-      var validatePass = (rule, value, callback) => {
+      var validaePass = (rule, value, callback) => {
         if (value === '') {
           callback(new Error('Please input the password'));
         } else {
@@ -669,7 +668,7 @@ Form component allows you to verify your data, helping you find and correct erro
           callback();
         }
       };
-      var validatePass2 = (rule, value, callback) => {
+      var validaePass2 = (rule, value, callback) => {
         if (value === '') {
           callback(new Error('Please input the password again'));
         } else if (value !== this.ruleForm2.pass) {
@@ -686,16 +685,13 @@ Form component allows you to verify your data, helping you find and correct erro
         },
         rules2: {
           pass: [
-            { required: true, message: 'Please input the password', trigger: 'blur' },
-            { validator: validatePass }
+            { validator: validaePass, trigger: 'blur' }
           ],
           checkPass: [
-            { required: true, message: 'Please input the password again', trigger: 'blur' },
-            { validator: validatePass2 }
+            { validator: validaePass2, trigger: 'blur' }
           ],
           age: [
-            { required: true, message: 'Please input the age', trigger: 'blur' },
-            { validator: checkAge, trigger: 'change' }
+            { validator: checkAge, trigger: 'change', trigger: 'blur' }
           ]
         }
       };

examples/docs/zh-CN/form.md

@@ -2,13 +2,14 @@
   export default {
     data() {
       var checkAge = (rule, value, callback) => {
-        var age = parseInt(value, 10);
-
+        if (!value) {
+          return callback(new Error('年龄不能为空'));
+        }
         setTimeout(() => {
-          if (!Number.isInteger(age)) {
+          if (!Number.isInteger(value)) {
             callback(new Error('请输入数字值'));
-          } else{
-            if (age < 18) {
+          } else {
+            if (value < 18) {
               callback(new Error('必须年满18岁'));
             } else {
               callback();
@@ -110,16 +111,13 @@
         },
         rules2: {
           pass: [
-            { required: true, message: '请输入密码', trigger: 'blur' },
-            { validator: validatePass }
+            { validator: validatePass, trigger: 'blur' }
           ],
           checkPass: [
-            { required: true, message: '请再次输入密码', trigger: 'blur' },
-            { validator: validatePass2 }
+            { validator: validatePass2, trigger: 'blur' }
           ],
           age: [
-            { required: true, message: '请填写年龄', trigger: 'blur' },
-            { validator: checkAge, trigger: 'change' }
+            { validator: checkAge, trigger: 'blur' }
           ]
         },
         dynamicForm: {
@@ -626,7 +624,7 @@
     <el-input type="password" v-model="ruleForm2.checkPass" auto-complete="off"></el-input>
   </el-form-item>
   <el-form-item label="年龄" prop="age">
-    <el-input v-model="ruleForm2.age"></el-input>
+    <el-input v-model.number="ruleForm2.age"></el-input>
   </el-form-item>
   <el-form-item>
     <el-button type="primary" @click="handleSubmit2">提交</el-button>
@@ -637,13 +635,14 @@
   export default {
     data() {
       var checkAge = (rule, value, callback) => {
-        var age = parseInt(value, 10);
-
+        if (!value) {
+          return callback(new Error('年龄不能为空'));
+        }
         setTimeout(() => {
-          if (!Number.isInteger(age)) {
+          if (!Number.isInteger(value)) {
             callback(new Error('请输入数字值'));
-          } else{
-            if (age < 18) {
+          } else {
+            if (value < 18) {
               callback(new Error('必须年满18岁'));
             } else {
               callback();
@@ -678,16 +677,13 @@
         },
         rules2: {
           pass: [
-            { required: true, message: '请输入密码', trigger: 'blur' },
-            { validator: validatePass }
+            { validator: validatePass, trigger: 'blur' }
           ],
           checkPass: [
-            { required: true, message: '请再次输入密码', trigger: 'blur' },
-            { validator: validatePass2 }
+            { validator: validatePass2, trigger: 'blur' }
           ],
           age: [
-            { required: true, message: '请填写年龄', trigger: 'blur' },
-            { validator: checkAge, trigger: 'change' }
+            { validator: checkAge, trigger: 'blur' }
           ]
         }
       };