首先插件的下载地址和官方文档都在 [WxValidate下载地址和文档地址](https://github.com/wux-weapp/wx-extend) 

具体的WxValidate.js文件的位置在wx-extend/src/assets/plugins/wx-validate/WxValidate.js

首先引入的方法就是将插件文件拷贝到你所需要的文件目录下

```javascript

// index.js文件下

import WxValidate from '../../utils/WxValidate.js'

const app = getApp()

Page ({

data:{

form:{

name:'',

phone:''

        }

    }

})

```

之后可以采用局部引用的方式将插件引入到你所需要的页面的JS文件里,具体操作如下

这里需要注意的是文件路径的写法/是从根目录开始算起 ./是从引入文件的目录文件开始,此例子中就是index.js所在目录开始算起 ../就是从引入文件的父级目录开始算起,此例子中index文件夹目录,而../../就是从pages所在目录开始算起,如果这个地方的文件路径写错,编译就会报错。

然后就是注意在wxml文件中对表单组件的数据绑定,否则无论表单组件如何填写,都无法验证规则。

表单组件的绑定方法如下

主要的方法就是在需要验证的input框内加入value值的绑定,其他的组件同理

然后在js文件中加入form表单的绑定


最后就是最重要的验证规则的书写了

首先要在onLoad函数中加入验证规则函数


此处需要注意的是一定要在js文件中onLoad验证规则,否则编译会报checkform is not a function 

然后是验证规则和报错规则的代码

点赞(1071) 打赏

评论列表 共有 0 条评论

暂无评论
立即
投稿
发表
评论
返回
顶部