刚开始的时候,我给了个默认时间

我把时间清除后,他会进行校验,这时候是可以的

但是当我再次选择时间时,他的校验一直没有消失,那肯定是某些地方有问题

我当时一直在该组件和rules里面找问题

 <el-form-item label="进出时间" prop="entryTimeRange">
<el-date-picker
     :clearable="false"
     v-model="fliterParam.entryTimeRange"
     type="datetimerange"
     range-separator="至"
     start-placeholder="开始日期"
     end-placeholder="结束日期"
     value-format="yyyy-MM-dd HH:mm:ss"
     format="yyyy-MM-dd HH:mm:ss"
     :picker-options="pickerOptions"
  ></el-date-picker>
</el-form-item>


rules: {
    entryTimeRange: [{required: true, message: '请选择进出时间', trigger: 'change'}]
}

这里提醒一下:prop和v-model、rules里的三个值,要是一致的!!!!

后来发现,问题其实超级简单,我人傻了

<el-form v-model="fliterParam" inline label-suffix=":" :rules="rules" ref="ruleForm"></el-form>

原因其实就在这,把v-model改成   :model   就ok了


v-model 和 :model的区别

v-model 和 :model 其实不是同一个东西,
v-model,是进行数据双向绑定的,:model是element用来进行表单验证的

不管你的选择器、输入框、时间选择器、单选多选等,v-model绑定了什么值,但假如说你没有在表单上:model来绑定验证的数据对象或者绑定了其他数据对象的话,就可能会出现这种情况(哪怕表单里面有数据,但是却还是输入验证不通过)。

GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:3 个月前 )
c345bb45 7 个月前
a07f3a59 * Update transition.md * Update table.md * Update transition.md * Update table.md * Update transition.md * Update table.md * Update table.md * Update transition.md * Update popover.md 7 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐