记录在使用vue-quill-editor验证不能为空和输入空格时的验证问题
解决方案:
1、在quill-editor上加change事件
2、验证正则
data() {
let validates = (rule, value, callback) => {
// reg是用于解析富文本标签里的内容,
const reg = /(?!<(img|video).*?>)<.*?>/g
// strings 是解析出来的内容,不包含标签
const strings = value.replace(reg, '')
// value是空,callback触发不能为空
if (value === "") {
callback(new Error("内容不能为空"));
// 如果解析出来的内容是空或全部是空格,callback触发不能为空
} else if (strings.match(/^[ ]*$/)) {
callback(
new Error("内容不能为空")
);
} else {
callback();
}
};
return {
form: { agreementtpye: 0 },
rules: {
title: [{ required: true, message: "请填写协议标题", trigger: "blur" }],
content: [{ required: true, validator: validates, message: "请填写协议内容", trigger: "blur" }],
},
loading: true,
};
},