• 微信小程序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:'提交成功'
    })
    }
    })
     
  • 相关阅读:
    自定义 ListView
    linux IO重定向
    Facebook开源C++组件库Folly
    在vi按了ctrl+s后
    让Erlang服务器后台运行
    mysql innodb 性能相关参数
    linux 网卡驱动升级
    kernel panic
    32位Linux下使用2G以上大文件的几个相关宏的关系
    CentOS安装erlang
  • 原文地址:https://www.cnblogs.com/wugai/p/10918487.html
Copyright © 2020-2023  润新知