docs: update docs for DatePicker and so on

liujin230124 · Oct 28, 2016 · eeb6ab5 · eeb6ab5
1 parent f7e480a
commit eeb6ab5
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 45 deletions.
diff --git a/components/date-picker/index.en-US.md b/components/date-picker/index.en-US.md
@@ -12,7 +12,7 @@ By clicking the input box, you can select a date from a popup calendar.
 
 ## API
 
-### DatePicker
+Note: Part of locale of DatePicker, MonthPicker, RangePicker is read from value. So, please set the locale of moment correctly.
 
 ```jsx
 import moment from 'moment-timezone/moment-timezone';
@@ -27,22 +27,31 @@ moment.tz.setDefault('Asia/Shanghai')
 <DatePicker defaultValue={moment('2015-01-01', 'YYYY-MM-DD')} />
 ```
 
-| Property         | Description           | Type     | Default       |
+### Common API
+
+The following APIs are shared by DatePicker, MonthPicker, RangePicker.
+
+| Property     | Description    | Type     | Default      |
 |--------------|----------------|----------|--------------|
-| value        | to set date           | [moment](http://momentjs.com/)   | -           |
-| defaultValue | to set default date        | [moment](http://momentjs.com/)   | -           |
-| format       | to set the date format, refer to [moment.js](http://momentjs.com/) | String   | "YYYY-MM-DD" |
-| disabledDate | to specify the date that cannot be selected | function | -           |
-| onChange     | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | -           |
+| allowClear   | Whether to show clear button | bool | true |
 | disabled     | determine whether the DatePicker is disabled           | Boolean     | false        |
 | style        | to customize the style of the input box     | Object     | {}   |
 | popupStyle   | to customize the style of the popup calendar   | Object     | {}   |
 | size         | determine the size of the input box, the height of `large` and `small`, are 32px and 22px respectively, while default size is 28px | String   | -  |
 | locale       | localization configuration | Object   | [default](https://github.com/ant-design/ant-design/issues/424)  |
-| onOk         | a callback function, can be executed when OK-button is clicked | function(Date value) | - |
+| disabledDate | to specify the date that cannot be selected | function | -           |
+| getCalendarContainer | to set the container of the floating layer, while the default is to create a `div` element in `body` | function(trigger) | - |
+
+### DatePicker
+
+| Property         | Description           | Type     | Default       |
+|--------------|----------------|----------|--------------|
+| value        | to set date           | [moment](http://momentjs.com/)   | -           |
+| defaultValue | to set default date        | [moment](http://momentjs.com/)   | -           |
+| format       | to set the date format, refer to [moment.js](http://momentjs.com/) | String   | "YYYY-MM-DD" |
+| onChange     | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | -           |
 | open | open state of picker | bool | - |
 | onOpenChange   | a callback function, can be executed whether the popup calendar is popped up or closed | function(status) | - |
-| getCalendarContainer | to set the container of the floating layer, while the default is to create a `div` element in `body` | function(trigger) | - |
 | showTime     | to provide an additional time selection  | Object/Boolean | [TimePicker Options](/components/time-picker/#api) |
 
 ### MonthPicker
@@ -52,29 +61,18 @@ moment.tz.setDefault('Asia/Shanghai')
 | value        | to set date          | [moment](http://momentjs.com/)   | -           |
 | defaultValue | to set default date       | [moment](http://momentjs.com/)   | -           |
 | format       | to set the date format, refer to [moment.js](http://momentjs.com/) | String   | "YYYY-MM" |
-| disabledDate | to specify the date that cannot be selected | function | -           |
 | onChange     | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | -           |
-| disabled     | determine whether the MonthPicker is disabled           | Boolean     | false        |
-| style        | to customize the style of the input box     | Object     | {}   |
-| popupStyle   | to customize the style of the popup calendar   | Object     | {}   |
-| size         | determine the size of the input box, the height of `large` and `small`, are 32px and 22px respectively, while default size is 28px | String   | -  |
-| locale       | localization configuration | Object   | [default](https://github.com/ant-design/ant-design/issues/424)  |
-| getCalendarContainer | to set the container of the floating layer, while the default is to create a `div` element in `body` | function(trigger) | - |
 
 ### RangePicker
 
 | Property         | Description           | Type     | Default       |
 |--------------|----------------|----------|--------------|
-| value        | to set date          | [moment, moment]   | -           |
-| defaultValue | to set default date       | [moment, moment]   | -           |
+| value        | to set date          | [[moment](http://momentjs.com/), [moment](http://momentjs.com/)]   | -           |
+| defaultValue | to set default date       | [[moment](http://momentjs.com/), [moment](http://momentjs.com/)]   | -           |
 | format       | to set the date format  | String    | "YYYY-MM-DD HH:mm:ss" |
 | onChange     | a callback function, can be executed when the selected time is changing | function(dates: [moment, moment], dateStrings: [string, string]) | -           |
 | showTime     | to provide an additional time selection  | Object/Boolean | [TimePicker Options](/components/time-picker/#api) |
-| disabledDate | to specify the date that cannot be selected | function(date: moment, dateString: string) | - |
-| disabledTime | to specify the time that cannot be selected | function(dates: [moment, moment], partial: 'start'|'end') | - |
-
-The following properties are the same with `DatePicker`: `disabled` `style` `popupStyle` `size` `locale` `showTime` `onOk` `getCalendarContainer`
-
+| disabledTime | to specify the time that cannot be selected | function(dates: [moment, moment], partial: `'start'|'end'`) | - |
 
 <style>
 .code-box-demo .ant-calendar-picker {

diff --git a/components/date-picker/index.zh-CN.md b/components/date-picker/index.zh-CN.md
@@ -13,7 +13,7 @@ subtitle: 日期选择框
 
 ## API
 
-### DatePicker
+注意：DatePicker、MonthPicker、RangePicker 部分 locale 是从 value 中读取，所以请先正确设置 moment 的 locale。
 
 ```jsx
 import moment from 'moment-timezone/moment-timezone';
@@ -28,51 +28,52 @@ moment.tz.setDefault('Asia/Shanghai')
 <DatePicker defaultValue={moment('2015-01-01', 'YYYY-MM-DD')} />
 ```
 
-| 参数         | 说明           | 类型     | 默认值       |
+### 共同的 API
+
+以下 API 为 DatePicker、MonthPicker、RangePicker 共享的 API。
+
+| 参数          | 说明            | 类型     | 默认值        |
 |--------------|----------------|----------|--------------|
-| value        | 日期           | [moment](http://momentjs.com/)   | 无           |
-| defaultValue | 默认日期       | [moment](http://momentjs.com/)   | 无           |
-| format       | 展示的日期格式，配置参考 [moment.js](http://momentjs.com/) | string   | "YYYY-MM-DD" |
-| disabledDate | 不可选择的日期 | function | 无           |
-| onChange     | 时间发生变化的回调 | function(date: moment, dateString: string) | 无           |
+| allowClear   | 是否显示清除按钮 | bool     | true         |
 | disabled     | 禁用           | bool     | false        |
 | style        | 自定义输入框样式     | object     | {}   |
 | popupStyle   | 格外的弹出日历样式   | object     | {}   |
 | size         | 输入框大小，`large` 高度为 32px，`small` 为 22px，默认是 28px | string   | 无  |
 | locale       | 国际化配置 | object   | [默认配置](https://github.com/ant-design/ant-design/issues/424)  |
+| disabledDate | 不可选择的日期 | function | 无           |
+| getCalendarContainer | 定义浮层的容器，默认为 body 上新建 div | function(trigger) | 无 |
+
+### DatePicker
+
+| 参数         | 说明           | 类型     | 默认值       |
+|--------------|----------------|----------|--------------|
+| value        | 日期           | [moment](http://momentjs.com/)   | 无           |
+| defaultValue | 默认日期       | [moment](http://momentjs.com/)   | 无           |
+| format       | 展示的日期格式，配置参考 [moment.js](http://momentjs.com/) | string   | "YYYY-MM-DD" |
+| onChange     | 时间发生变化的回调 | function(date: moment, dateString: string) | 无           |
 | open | 控制弹层是否展开 | bool | - |
 | onOpenChange   | 弹出日历和关闭日历的回调 | function(status) | 无 |
-| getCalendarContainer | 定义浮层的容器，默认为 body 上新建 div | function(trigger) | 无 |
 | showTime     | 增加时间选择功能  | Object or Boolean | [TimePicker Options](/components/time-picker/#api) |
 
 ### MonthPicker
 
 | 参数         | 说明           | 类型     | 默认值       |
 |--------------|----------------|----------|--------------|
-| value        | 日期           | moment   | 无           |
-| defaultValue | 默认日期       | moment   | 无           |
+| value        | 日期           | [moment](http://momentjs.com/)   | 无           |
+| defaultValue | 默认日期       | [moment](http://momentjs.com/)   | 无           |
 | format       | 展示的日期格式，配置参考 [moment.js](http://momentjs.com/) | string   | "YYYY-MM" |
-| disabledDate | 不可选择的日期 | function | 无           |
 | onChange     | 时间发生变化的回调，发生在用户选择时间时 | function(date: moment, dateString: string) | 无           |
-| disabled     | 禁用           | bool     | false        |
-| style        | 自定义输入框样式     | object     | {}   |
-| popupStyle   | 格外的弹出日历样式   | object     | {}   |
-| size         | 输入框大小，`large` 高度为 32px，`small` 为 22px，默认是 28px | string   | 无  |
-| locale       | 国际化配置 | object   | [默认配置](https://github.com/ant-design/ant-design/issues/424)  |
-| getCalendarContainer | 定义浮层的容器，默认为 body 上新建 div | function(trigger) | 无 |
 
 ### RangePicker
 
 | 参数         | 说明           | 类型     | 默认值       |
 |--------------|----------------|----------|--------------|
-| value        | 日期          | [moment, moment]   | 无           |
-| defaultValue | 默认日期       | [moment, moment]   | 无           |
+| value        | 日期          | [[moment](http://momentjs.com/), [moment](http://momentjs.com/)]   | 无           |
+| defaultValue | 默认日期       | [[moment](http://momentjs.com/), [moment](http://momentjs.com/)]   | 无           |
 | format       | 展示的日期格式  | string    | "YYYY-MM-DD HH:mm:ss" |
 | onChange     | 时间发生变化的回调，发生在用户选择时间时 | function(dates: [moment, moment], dateStrings: [string, string]) | 无           |
 | showTime     | 增加时间选择功能  | Object or Boolean | [TimePicker Options](/components/time-picker/#api) |
-| disabledDate | 不可选择的日期 | function | 无 |
-| disabledTime | 不可选择的时间 | function(dates: [moment, moment], partial: 'start'|'end') | 无 |
-`disabled` `style` `popupStyle` `size` `locale` `showTime` `onOk` `getCalendarContainer` 属性与 DatePicker 的一致。
+| disabledTime | 不可选择的时间 | function(dates: [moment, moment], partial: `'start'|'end'`) | 无 |
 
 <style>
 .code-box-demo .ant-calendar-picker {