Elementui el-select创建条目的多选下拉框 自定义校验 新增条目时字符长度限制
程序员文章站
2022-07-14 08:49:03
...
数据格式
- tags默认设置为为[]
dataForm: {
id: 0,
tags: [],
},
rules: {
tags: [{
type: 'array',
trigger: 'change',
validator: tagslength
}]
},
验证规则
- 多选value返回的是一个数组,需要循环去判断,我加了一个show,只要有标签长度超过时就改变状态去回调。
// 验证标签长度
let tagslength = (rule, value, callback) => {
if (value.length == 0) {
callback(new Error('至少输入一个标签'))
} else {
var show = true
for (let i in value) {
if (value[i].name == undefined) {
var tempValue = value[i]
} else {
var tempValue = value[i].name
}
var len = 0;
for (let j = 0; j < tempValue.length; j++) {
var c = tempValue.charCodeAt(j);
//单字节加1
if ((c >= 0x0001 && c <= 0x007e) || (0xff60 <= c && c <= 0xff9f)) {
len++;
} else {
len += 2;
}
}
if (len > 20) {
show = false
}
}
if (!show) {
callback(new Error('标签名长度不能超过10!'))
} else {
callback()
}
}
}