驗證手機號/中文姓名/英文姓名/密碼/郵箱等：
data : {
? ? // 設(shè)置身份證號的驗證規(guī)則
? ? const idCard = (rule, value, callback) => {
? ? ? if (!value) {
? ? ? ? callback(new Error('請輸入身份證號'))
? ? ? } else {
? ? ? ? const reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
? ? ? ? if (reg.test(value)) {
? ? ? ? ? callback()
? ? ? ? } else {
? ? ? ? ? return callback(new Error('請輸入正確的身份證號'))
? ? ? ? }
? ? ? }
? ? }
? ? // 設(shè)置手機號的驗證規(guī)則
? ? const checkPhone = (rule, value, callback) => {
? ? ? if (!value) {
? ? ? ? callback(new Error('請輸入聯(lián)系方式'))
? ? ? } else {
? ? ? ? const reg = /^1[3|4|5|7|8][0-9]\d{8}$/
? ? ? ? if (reg.test(value)) {
? ? ? ? ? callback()
? ? ? ? } else {
? ? ? ? ? return callback(new Error('請輸入正確的電話'))
? ? ? ? }
? ? ? }
? ? }
? ? // 設(shè)置密碼的驗證規(guī)則
? ? const checkPass = (rule, value, callback) => {
? ? ? if (value === '') {
? ? ? ? callback(new Error('請輸入密碼'))
? ? ? } else {
? ? ? ? if (this.addForm.checkPass !== '') {
? ? ? ? ? this.$refs.addForm.validateField('checkPass')
? ? ? ? }
? ? ? ? callback()
? ? ? }
? ? }
? ? // 設(shè)置確認密碼的驗證規(guī)則
? ? const checkPassAgain = (rule, value, callback) => {
? ? ? if (value === '') {
? ? ? ? callback(new Error('請再次輸入密碼'))
? ? ? } else if (value !== this.addForm.password) {
? ? ? ? callback(new Error('兩次輸入密碼不一致!'))
? ? ? } else {
? ? ? ? callback()
? ? ? }
? ? }
? ? // 英名驗證
? ? const enName = (rule, value, callback) => {
? ? ? if (!value) {
? ? ? ? callback(new Error('請輸入英文名'))
? ? ? } else {
? ? ? ? const reg = /^[a-zA-Z]+$/ // 驗證沒有空格的英文名
? ? ? ? // const reg = /^[a-zA-Z][A-Za-z\s]*[a-zA-Z]*$/ 驗證有空格的英文名
? ? ? ? if (value.length < 100 && reg.test(value)) {
? ? ? ? ? callback()
? ? ? ? } else {
? ? ? ? ? return callback(new Error('請輸入正確的英文名'))
? ? ? ? }
? ? ? }
? ? }
? ? // 中名驗證
? ? const chnName = (rule, value, callback) => {
? ? ? if (!value) {
? ? ? ? callback(new Error('請輸入中文名'))
? ? ? } else {
? ? ? ? const reg = /^[\u4e00-\u9fa5]+$/
? ? ? ? if (value.length < 100 && reg.test(value)) {
? ? ? ? ? callback()
? ? ? ? } else {
? ? ? ? ? return callback(new Error('請輸入正確的中文名'))
? ? ? ? }
? ? ? }
? ? }
? ? return {
? ? ? // 新增數(shù)據(jù)規(guī)則
? ? ? addRules: {
? ? ? ? // 身份證
? ? ? ? credentialNo: [
? ? ? ? ? { required: true, validator: idCard, trigger: 'blur' }
? ? ? ? ],
? ? ? ? // 密碼
? ? ? ? password: [
? ? ? ? ? { required: true, validator: checkPass, trigger: 'blur' },
? ? ? ? ? { min: 6, max: 12, message: '長度在 6 到 12 個字符', trigger: 'blur' }
? ? ? ? ],
? ? ? ? // 校驗密碼
? ? ? ? checkPass: [
? ? ? ? ? { required: true, validator: checkPassAgain, trigger: 'blur' },
? ? ? ? ? { min: 6, max: 12, message: '長度在 6 到 12 個字符', trigger: 'blur' }
? ? ? ? ],
? ? ? ? chnName : [
? ? ? ? ? { required: true, validator: chnName, trigger: 'blur' }
? ? ? ? ],
? ? ? ? enName: [
? ? ? ? ? { required: true, validator: enName, trigger: 'blur' }
? ? ? ? ],
? ? ? ? phone: [
? ? ? ? ? { required: true, validator: checkPhone, trigger: 'blur' }
? ? ? ? ]
? ? ? },
? ? ? ? // 驗證郵箱
? ? ? const validateEmail = (rule, value, callback) => {
? ? ? ? ? if (/^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/.test(value) || !value) {
? ? ? ? ? ? callback()
? ? ? ? ? } else {
? ? ? ? ? ? callback(new Error('請輸入正確郵箱'))
? ? ? ? ? }
? ? ? }
? ? }
}
對出生日期進行限制(只能選擇當天以前的日期)
獲取今天日期
let nowDay = new Date().toLocaleDateString().split('/').join('-')???????
// 將1970/08/08轉(zhuǎn)化成1970-08-08
template中：
<el-date-picker v-model="addForm.birthDate" type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="選擇日期" :picker-options="pickerBeginDateBefore" style="width: 100%"></el-date-picker>
data中：
data(){
? ? return {
? ? ? // 出生日期限制
? ? ? pickerBeginDateBefore: {
? ? ? ? disabledDate (time) {
? ? ? ? ? return time.getTime() > Date.now() - 8.64e7
? ? ? ? ? //（帶 - 8.64e7時，今天之前的日期，不包括今天）
? ? ? ? ? // return time.getTime() > Date.now() - 8.64e7 （今天之后的日期，包括今天）
? ? ? ? }
? ? ? }
? ? }
}
