DatePicker: update docs for default-time (#9335)

This commit is contained in:
杨奕
2018-01-18 15:35:31 +08:00
committed by FuryBean
parent aaf6e7e815
commit e99c12ca04
6 changed files with 185 additions and 81 deletions

View File

@@ -65,8 +65,7 @@
value9: '',
value10: '',
value11: '',
value12: '',
value13: ''
value12: []
};
}
};
@@ -306,6 +305,7 @@
<el-date-picker
v-model="value9"
type="daterange"
align="right"
start-placeholder="开始日期"
end-placeholder="结束日期"
default-value="2010-10-01">
@@ -328,31 +328,19 @@
### 默认的起始与结束时刻
使用类型`datetimerange`选择时间范围时,在日期选择面板中选定起始与结束的日期,默认会使用该日期的`00:00:00`作为起始与结束的时刻;通过选项`default-time`可以控制选中起始与结束日期时所使用的具体时刻。
在选择日期范围时,指定起始日期和结束日期的默认时刻。
`default-time`接受一个数组,数组每项值为字符串,形如`12:00:00`,其中第一项控制起始日期的具体时刻,第二控制结束日期的具体时刻。
:::demo
:::demo 选择日期范围时,默认情况下,起始日期和结束日期的时间部分均为当天的 0 点 0 分 0 秒。通过`default-time`可以分别指定二者的具体时刻。`default-time`接受一个数组,其中的值为形如`12:00:00`的字符串,第一个值控制起始日期的时刻,第二个值控制结束日期的时刻。
```html
<template>
<div class="block">
<span class="demonstration">起始日期时刻为 12:00:00</span>
<p>组件值:{{ value12 }}</p>
<el-date-picker
v-model="value12"
type="datetimerange"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="['12:00:00']">
</el-date-picker>
</div>
<div class="block">
<span class="demonstration">起始日期时刻为 12:00:00结束日期时刻为 08:00:00</span>
<el-date-picker
v-model="value13"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="['12:00:00', '08:00:00']">
:default-time="['00:00:00', '23:59:59']">
</el-date-picker>
</div>
</template>
@@ -361,8 +349,7 @@
export default {
data() {
return {
value12: '',
value13: ''
value12: []
};
}
};
@@ -436,7 +423,7 @@
| picker-options | 当前时间日期选择器特有的选项参考下表 | object | — | {} |
| range-separator | 选择范围时的分隔符 | string | — | '-' |
| default-value | 可选,选择器打开时默认显示的时间 | Date | 可被`new Date()`解析 | — |
| default-time | 可选,选择器 type 为 `datetimerange`范围选择选中日期所使用的当日内具体时刻 | string[] | 数组,长度为 2每项值为字符串形如`12:00:00`,第一项指定开始日期的时刻,第二项指定结束日期的时刻,不指定会使用时刻 `00:00:00` | — |
| default-time | 范围选择选中日期所使用的当日内具体时刻 | string[] | 数组,长度为 2每项值为字符串形如`12:00:00`,第一项指定开始日期的时刻,第二项指定结束日期的时刻,不指定会使用时刻 `00:00:00` | — |
| value-format | 可选,绑定值的格式。不指定则绑定值为 Date 对象 | string | 年 `yyyy`,月 `MM`,日 `dd`,小时 `HH`,分 `mm`,秒 `ss`AM/PM `A` | — |
| name | 原生属性 | string | — | — |
| unlink-panels | 在范围选择器里取消两个日期面板之间的联动 | boolean | — | false |