注册表单验证

pages/register/index.js

@@ -1,5 +1,6 @@
 // pages/register/index.js
 const { gender } = require('../../utils/dict')
+import WxValidate from '../../utils/wxValidate'
 const app = getApp();
 Page({
     /**
@@ -11,13 +12,18 @@ Page({
         fields: [
             { label: '头像', model: 'icon', type: "upload" },
             { label: '姓名', model: 'name' },
-            { label: '身份证号', model: 'card', type:'idCard' },
+            { label: '身份证号', model: 'card', type: 'idCard' },
             { label: '性别', model: 'gender', type: 'select' },
             { label: '手机号', model: 'phone' },
             { label: '邮箱', model: 'email' },
         ]
     },
-
+    initValidate() {
+        const rules = { icon: { required: true }, name: { required: true }, card: { required: true }, gender: { required: true }, phone: { required: true } }
+        // 验证字段的提示信息，若不传则调用默认的信息
+        const messages = { icon: { required: '请选择头像', }, name: { required: '请输入用户姓名', }, card: { required: '请输入身份证号', }, gender: { required: '请选择性别', }, phone: { required: '请输入手机号', } };
+        this.WxValidate = new WxValidate(rules, messages)
+    },
     async toSubmit(e) {
         const data = e?.detail;
         if (!data) return;
@@ -27,17 +33,23 @@ Page({
             return
         }
         data.openid = wxInfo.openid;
-        const res = await app.$post('/newCourt/api/user', data)
-        if (app.$checkRes(res)) {
-            wx.showToast({
-                title: '注册成功',
-                success: () => {
-                    wx.redirectTo({ url: '/pages/index/index' });
-                }
-            })
+        if (!this.WxValidate.checkForm(data)) {
+            const error = this.WxValidate.errorList[0];
+            wx.showToast({ title: `${error.msg}`, icon: 'error', duration: 2000 })
+            return false
         } else {
-            const { errmsg = '注册失败' } = res;
-            wx.showModal({ title: errmsg, showCancel: false })
+            const res = await app.$post('/newCourt/api/user', data)
+            if (app.$checkRes(res)) {
+                wx.showToast({
+                    title: '注册成功',
+                    success: () => {
+                        wx.redirectTo({ url: '/pages/index/index' });
+                    }
+                })
+            } else {
+                const { errmsg = '注册失败' } = res;
+                wx.showModal({ title: errmsg, showCancel: false })
+            }
         }
     },
 
@@ -49,6 +61,8 @@ Page({
         const fg = fields.find(f => f.model === 'gender')
         if (fg) fg.list = gender
         this.setData({ fields })
+        //验证规则函数
+        this.initValidate();
     },
 
     /**