(五) : iview 时间选择器,校验不成功

简介: (五) : iview 时间选择器,校验不成功

image.png

错误的校验

  <FormItem :label="$t('开始时间')" prop="template_benefit_info[0].start_date"
                            :rules="{ required: true, message: $t('请选择开始时间'), trigger: 'change'}">
                              <DatePicker  format="yyyy-MM-dd HH:mm:ss"  v-model="editFormData.template_benefit_info[0].start_date"
                              type="datetime" :options="startOption">
                              </DatePicker>
                            </FormItem>
                            <FormItem :label="$t('结束时间')" prop="template_benefit_info[0].end_date"
                             :rules="{ required: true, message: $t('请选择结束时间'), trigger: 'change'}">
                              <DatePicker  format="yyyy-MM-dd HH:mm:ss"  v-model="editFormData.template_benefit_info[0].end_date"
                              type="datetime" :options="endOption"></DatePicker>
                            </FormItem>

修改过后的

image.png


:rules="{ required: true, message: $t('请选择结束时间'), trigger: 'change', pattern:/.+/}"

image.png

相关文章
|
JavaScript 索引
【vue】element ui 实现动态表单点击按钮新增行/删除行
【vue】element ui 实现动态表单点击按钮新增行/删除行
3460 0
|
8月前
|
JavaScript 前端开发
【vue】iview如何把input输入框和点击输入框之后的边框去掉
【vue】iview如何把input输入框和点击输入框之后的边框去掉
169 0
|
6月前
|
JavaScript
iview 表单有值却校验失败
iview 表单有值却校验失败
365 1
|
8月前
|
JavaScript UED
【vue】iview组件 DatePicker 日期选择器如何显示默认当前日期
【vue】iview组件 DatePicker 日期选择器如何显示默认当前日期
463 1
|
5月前
|
JavaScript
Antd——表单使用自定义正则进行校验
Antd——表单使用自定义正则进行校验
85 0
|
JavaScript 前端开发
JS实现分页功能(单选按钮、全选按钮、跳转页面)
JS实现分页功能(单选按钮、全选按钮、跳转页面)
121 0
uniapp u-tabs表单如何默认选中
uniapp u-tabs表单如何默认选中
561 0
64EasyUI 表单 - 格式化下拉框
64EasyUI 表单 - 格式化下拉框
45 0
|
前端开发
react 获取表单中输入框的值
react 获取表单中输入框的值
144 0
|
JavaScript
VUE element组件输入框校验
VUE element组件输入框校验