用户登录-表单验证

一、userRulesMixin文件使用

1. common文件夹下创建userRulesMixin

export default {
  install (Vue) {   // 使用install的形式进行安装mixin
    Vue.mixin({
      data () {
        return {
          a:'hello world'
        }
      },
      methods: {
        test () {

        }
      }
    })
  }
}

2. main.js中使用mixin文件

   import userMixin from './common/rulesMixin.js'
   Vue.use(userMixin)
   

3. 组件或页面内直接进行使用

     onLoad: function () {
       console.log(this.test())
     }
   

二、验证规则编写

  userRules: {
            loginName: {
              rules: [
                { required: true, 'errorMessage': "账户名不能为空" },
                {
                  validateFunction: (rule, val, data, callback) => {
                    switch (true) {
                      case val.length < 6:
                        callback('用户名长度不正确')
                        break;
                      default:
                        return true
                    }
                  }
                }   // 自定义验证规则
              ]
            }
          }

手机号码正则表达式

/^(0|86|17951)?(13[0-9]|15[012356789]|166|17[3678]|18[0-9]|14[57])[0-9]{8}$/