DatePicker 日期选择器

用于选择或输入日期

选择日

以「日」为基本单位，基础的日期选择控件

你可以在 [model] 中定义一个初始值，如果留空，则优先显示当前时间。

<el-date-picker (modelChange)="handle($event)"
  (clear-click)="clearClickHandle($event)">
</el-date-picker>
<script type="text">
// in component:
handle(time: number): void {
  // [time] is string
  // date style follow format props
  console.log(time)
}
</script>

日期格式

预定义日期格式

[format] 属性非常强大，你可以发挥自己的想象力来定义它的格式。

<el-date-picker (modelChange)="handle($event)"
  [format]="'yyyy年MM月-dd日'">
</el-date-picker>

以月为单位

隐藏日期，以月为单位选择

[hidden-day] 可以隐藏日期的基本单位，同时你可以通过 format 来统一输出格式。

<el-date-picker (modelChange)="handle($event)"
  [format]="'yyyy - MM'" [hidden-day]="true">
</el-date-picker>

禁用

禁用整个日期组件

<el-date-picker (modelChange)="handle($event)"
  [elDisabled]="true">
</el-date-picker>

DatePicker Attributes