elementui el-form表单自定义规则

2022-03-07  本文已影响0人  泪滴在琴上

需求:
输入框只能输入20个字符(如果是汉字的话10个字)

<el-input v-model="addCourseForm.lesson_name" placeholder="请输入课程标题"></el-input>
data: function () {
            const checkLesson = (rule, value, cb) => {
                if (!value) return 0;
                var b = value.match(/[^\x00-\xff]/g);
                var len = value.length + (b ? b.length : 0);
                if (len > 20) {
                    return cb(new Error('最多可输入10个汉字 20个字符'))
                } else {
                    cb()
                }
            }
            return {
                addCourseForm: { //新增课程表单
                    lesson_name: '', //课程名称
                    daterange: [] //有效结束时间
                },
                itemRules: { //表单必填规则
                    lesson_name: [{
                        required: true,
                        message: '请输入课程标题',
                    }, {
                        validator: checkLesson,
                        message: '最多可输入10个汉字 20个字符',
                    }],
                    daterange: [{
                        required: true,
                        message: '请选择开始时间和结束时间',
                    }]
                },
                courseList: [], //课程列表
            }
上一篇 下一篇

猜你喜欢

热点阅读