1、表单日期范围的校验:
UI自带校验只可以校验单个日期,不能校验选择日期范围;采用自定义校验;
//页面中
<n-form-item require-mark-placement="left" :show-feedback="mainx.check" label="计费期限 :" path="planTime">
<n-date-picker
v-model:formatted-value="formx.time"
value-format='yyyy-MM-dd'
type="daterange"
@update:formatted-value="mainx.onChangeTime"
clearable
/>
</n-form-item>
//vue.js
// 计划起止日期-效验
let isPlanTime = function(rule, value, callback) {
let msgs = "", infos = false;
if (formx.time != null) {
infos = true;
} else {
infos = false;
msgs = "请选择计划起止日期";
}
if (infos == false) {
callback(new Error(msgs));
} else {
callback();
}
}
let formx = reactive({
time: null,
planTime: null,
startTime:'',
endTime: '',
});
let rulesx = {
planTime: { required: true, validator: isPlanTime, trigger: ["input", "blur"] },
};
2、校验区分数字、字符串;
有些数字是int类型,校验时需添加 "type=number"