• 微信小程序WxValidate插件的密码验证


    wxml

    <view class="section__title">密码</view>
    <input name="password" id="password" placeholder="请输入密码" value='{{form.password}}'/>
    <view class="section__title">确认密码</view>
    <input name="checkPassword" id="checkPassword" placeholder="请再次输入密码" value="{{form.checkPassword}}"/>
     
    js
    import WxValidate from "../../utils/WxValidate.js";
    // pages/verify/verify.js
    Page({

    /**
    * 页面的初始数据
    */
    data: {
    form:{
    password:"",
    checkPassword:"",
    }
    },
     
    /**
    * 生命周期函数--监听页面加载
    */
    onLoad: function (options){
    this.initValidate()//验证规则函数
    },
    //提交表单
    formSubmit(e){
    console.log(e.detail.value)
    },
    //报错
    showModal(error) {
    wx.showModal({
    content:error.msg,
    showModal:false,
    })
    },
    //验证函数
    initValidate(){
    //规则
    const rules = {
    password:{
    required: true,
    minlength:6,
    maxlength:16,
    },
    checkPassword:{
    required:true,
    equalTo: 'password',
    }
    }
    //返回信息
    const messages = {
    password:{
    required:'请填写密码',
    minlength:'密码长度不能少于6位',
    maxlength:'密码长度不能超过16位'
    },
    checkPassword:{
    required:'请填写确认密码',
    equalTo:'两次输入的密码不一致'
    }
    }
    this.WxValidate = new WxValidate(rules,messages)
    },
    //调用验证函数
    formSubmit(e){
    // this.data.form.password = 13456
    // this.setData({
    // form:this.data.form
    // })
    console.log(e.detail.value)
    console.log(this.data)
    const params = e.detail.value
    //校验表单
    if(!this.WxValidate.checkForm(params)){
    const error = this.WxValidate.errorList[0]
    this.showModal(error)
    return false
    }
    this.showModal({
    msg:'提交成功'
    })
    }
    })
     
  • 相关阅读:
    Tensorflow学习笔记1
    强化学习——从最简单的开始入手
    MATLAB R2017a 安装与破解
    C# 理解lock
    Bayer Pattern
    OpenCV参考手册之Mat类详解
    opencv学习之颜色空间转换cvtColor()
    UNICODE下CString转string
    解决VS2013报错fopen、sprintf等函数安全的问题
    Convert between cv::Mat and QImage 两种图片类转换
  • 原文地址:https://www.cnblogs.com/wugai/p/10918487.html
Copyright © 2020-2023  润新知