Element: 表单验证-Datetime Picker加入验证的情况下报错

[zongzmz]

ElementUI 1.0.0-rc.7

Chrome 53

Vue 2.0.3

<el-date-picker v-model="ruleForm.valueTime" type="datetimerange" placeholder="选择时间范围"></el-date-picker>

rules: {
  valueTime: [
               { type: 'date', required: true, message: '选择时间范围', trigger: 'change' }
            ]
}

console报错

1》 [Vue warn]: Error in watcher "value" 
(found in component <ElDatePicker>)
2》 TypeError: value.getTime is not a function(…)

通过查看element-ui.common.js 16337行
_rule2["default"].range(rule, value.getTime(), source, errors, options);代码

打印console.log(value)得知 时间范围的value是数组[];而表单验证例子是string类型没报错
希望能改进

[baiyaaaaa]

表单验证例子中的日期选择器不是 datetimerange 类型的日期选择器，而是 date 类型，两者绑定值类型也不同

[baiyaaaaa]

表单验证例子中的日期选择器不是 datetimerange 类型的日期选择器，而是 date 类型，两者绑定值类型也不同

[zongzmz]

那能不能在表单验证里面加入 datetimerange类型的？或者说有啥解决办法没有？

[baiyaaaaa]

datetimerange 类型一样是支持的，将验证类型设为数组就行了

[zongzmz]

<scrtipt>
export default {
    data() {
      return {
         ruleForm: {
              valueTime: []
        },
        rules: {
           valueTime: [ { type: 'datetimerange', required: true, message: '选择时间范围', trigger: 'change' }
          ]
      }
}
}
}
</script>

<template>
<el-form-item label="起止时间" prop="valueTime">
    <el-date-picker v-model="ruleForm.valueTime" type="datetimerange" placeholder="选择时间范围"></el-date-picker>
</el-form-item>
</template>

这样就可以了？
但是这样也报错。。。

vue.common.js?5ddb:2611 [Vue warn]: Error in watcher "value"
(found in component )warn @ vue.common.js?5ddb:2611run @ vue.common.js?5ddb:821flushSchedulerQueue @ vue.common.js?5ddb:623nextTickHandler @ vue.common.js?5ddb:401
element-ui.common.js?5284:15139 Uncaught (in promise) Error: Unknown rule type datetimerange(…)

[baiyaaaaa]

valueTime: [ { type: 'array', required: true, message: '选择时间范围', trigger: 'change' }]

[zongzmz]

哦哦 原来如此 谢谢

[zongzmz]

希望 多增加点说明文档 这样能直白些 谢谢

[luckymore]

@baiyaaaaa @zongzmz
设置 type: 'array' 的话，即使不选择日期，对应的model也是个数组啊

[null, null]

[zuimeiaj]

@baiyaaaaa 谢谢。我也刚好遇到这个问题