微信小程序表單驗(yàn)證WxValidate的使用
更新時(shí)間:2019年11月27日 11:41:09 作者:Independent
這篇文章主要介紹了微信小程序表單驗(yàn)證WxValidate的使用,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
效果圖GIF
git地址:WxValidate
使用
import WxValidate from '../../utils/WxValidate'; Page({ data: { basicInfo: { tel: '', post: '', weChat: '', specialPlane: '', email: '', intro: '' } }, onLoad() { this.initValidate(); }, initValidate() { const rules = { tel: { required: true, tel: true, }, post: { required: true, }, weChat: { required: true, }, specialPlane: { required: true, }, email: { required: true, email: true } }; const messages = { tel: { required: '請輸入手機(jī)號', tel: '請輸入正確格式手機(jī)號', }, post: { required: '請輸入職位', }, weChat: { required: '請輸入微信號', }, specialPlane: { required: '請輸入座機(jī)號', }, email: { required: '請輸入電子郵箱', email: '請輸入正確格式電子郵箱', } }; this.WxValidate = new WxValidate(rules, messages) }, formChange(val) { let obj = {} obj[`basicInfo.${val.currentTarget.dataset.val}`]= val.detail.value this.setData(obj) }, submitForm(e) { const params = e.detail.value if (!this.WxValidate.checkForm(params)) { const error = this.WxValidate.errorList[0] this.showModal(error) return false } }, showModal(error) { wx.showToast({ title: error.msg, icon: 'none', duration: 2000 }) }, })
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript彈出新窗口并控制窗口移動到指定位置的方法
這篇文章主要介紹了JavaScript彈出新窗口并控制窗口移動到指定位置的方法,涉及javascript針對彈出窗口的操作技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04JavaScript的模塊化:封裝(閉包),繼承(原型) 介紹
在復(fù)雜的邏輯下, JavaScript 需要被模塊化,模塊需要封裝起來,只留下供外界調(diào)用的接口。閉包是 JavaScript 中實(shí)現(xiàn)模塊封裝的關(guān)鍵,也是很多初學(xué)者難以理解的要點(diǎn)2013-07-07JavaScript Array對象擴(kuò)展indexOf()方法
JavaScript中Array對象沒有indexOf()方法,可通過下面的代碼擴(kuò)展,需要的朋友可以參考下2014-05-05JavaScript注冊時(shí)密碼強(qiáng)度校驗(yàn)代碼
這篇文章主要為大家詳細(xì)介紹了JavaScript注冊時(shí)密碼強(qiáng)度校驗(yàn)代碼,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-06在小程序中集成redux/immutable/thunk第三方庫的方法
這篇文章主要介紹了在小程序中集成redux/immutable/thunk第三方庫的方法,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-08-08getElementByID、createElement、appendChild幾個(gè)DHTML元素
WEB標(biāo)準(zhǔn)下可以通過getElementById(), getElementsByName(), and getElementsByTagName()訪問2008-06-06