Elementui el-select创建条目的多选下拉框 自定义校验 新增条目时字符长度限制

数据格式

• 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()
		}
	}
}