Merge pull request #158 from QingWei-Li/fix/datepicker

DatePicker: fix initial value is string, #157

CHANGELOG.md

@@ -8,6 +8,7 @@
 - 修复 Menu 组件 default-active 绑定动态值无法更新的问题
 - 新增特性 Menu 组件中若选中子菜单项现在会自动展开所有父级菜单
 - 修复 vue-popper 引入 popper 路径错误
+- 修复 DatePicker 初始值是合法时间类型但无法设置成功的问题
 
 #### 非兼容性更新
 - Menu 组件的 `unique-opend` 属性修正为 `unique-opened`

examples/docs/date-picker.md

@@ -51,7 +51,7 @@
             }
           }]
         },
-        value1: '',
+        value1: '2016-08-10',
         value2: '',
         value3: '',
         value4: '',

examples/docs/time-picker.md

@@ -34,13 +34,25 @@
 
 :::demo 使用 el-time-picker 标签，通过`selectableRange`限制可选时间范围
 ```html
-<el-time-picker
+<template>
-  v-model="value2"
+  <el-time-picker
-  :picker-options="{
+    v-model="value2"
-    selectableRange: '18:30:00 - 20:30:00'
+    :picker-options="{
-  }"
+      selectableRange: '18:30:00 - 20:30:00'
-  placeholder="任意时间点">
+    }"
-</el-time-picker>
+    placeholder="任意时间点">
+  </el-time-picker>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+        value2: new Date(2016, 9, 10, 18, 40)
+      };
+    }
+  }
+</script>
 ```
 :::
 
@@ -50,25 +62,38 @@
 
 :::demo
 ```html
-<el-time-select
+<template>
-  placeholder="起始时间"
+  <el-time-select
-  v-model="startTime"
+    placeholder="起始时间"
-  :picker-options="{
+    v-model="startTime"
-    start: '08:30',
+    :picker-options="{
-    step: '00:15',
+      start: '08:30',
-    end: '18:30'
+      step: '00:15',
-  }">
+      end: '18:30'
-</el-time-select>
+    }">
-<el-time-select
+  </el-time-select>
-  placeholder="结束时间"
+  <el-time-select
-  v-model="endTime"
+    placeholder="结束时间"
-  :picker-options="{
+    v-model="endTime"
-    start: '08:30',
+    :picker-options="{
-    step: '00:15',
+      start: '08:30',
-    end: '18:30',
+      step: '00:15',
-    minTime: startTime
+      end: '18:30',
-  }">
+      minTime: startTime
-</el-time-select>
+    }">
+  </el-time-select>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+        startTime: '',
+        endTime: ''
+      };
+    }
+  }
+</script>
 ```
 :::
 
@@ -78,11 +103,23 @@
 
 :::demo 添加`is-range`属性即可选择时间范围
 ```html
-<el-time-picker
+<template>
-  is-range
+  <el-time-picker
-  v-model="value3"
+    is-range
-  placeholder="选择时间范围">
+    v-model="value3"
-</el-time-picker>
+    placeholder="选择时间范围">
+  </el-time-picker>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+        value3: [new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)]
+      };
+    }
+  }
+</script>
 ```
 :::
 

packages/date-picker/src/util/index.js

@@ -25,7 +25,8 @@ export const merge = function(target) {
 };
 
 export const formatDate = function(date, format) {
-  if (!(date instanceof Date)) return '';
+  date = new Date(date);
+  if (isNaN(date.getTime())) return '';
   return dateUtil.format(date, format || 'yyyy-MM-dd');
 };