码迷,mamicode.com
首页 > 其他好文 > 详细

Vue-邮箱正则验证

时间:2019-06-12 11:06:17      阅读:812      评论:0      收藏:0      [点我收藏+]

标签:hold   amp   reg   ref   res   turn   port   pre   ret   

 

<el-form ref="emailForm" :model="emailForm" :rules="rules" label-width="120px">
    <el-form-item label="电子邮箱" prop="mailAddress">
        <el-input placeholder="请填写邮箱地址" v-model="emailForm.mailAddress" @blur="sendEmail"></el-input>
    </el-form-item>
</el-form>
    export default {
        name: ‘email‘,
        data() {
            return {
                emailForm: {
                    mailAddress: null
                },
                rules: {
                    mailAddress: [{ required: true, message: ‘请填写电子邮箱‘, trigger: ‘change‘ }]
                }
            }
        },
        methods: {
            sendEmail: function() {
                var regEmail = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
                if (this.emailForm.mailAddress != ‘‘ && !regEmail.test(this.emailForm.mailAddress)) {
                    this.$message({
                        message: ‘邮箱格式不正确‘,
                        type: ‘error‘
                    })
                    this.emailForm.mailAddress = ‘‘
                }
            }
        }
    }

Vue-邮箱正则验证

标签:hold   amp   reg   ref   res   turn   port   pre   ret   

原文地址:https://www.cnblogs.com/zltao/p/11007950.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!