element-plus/docs/en-US/component/time-select.md
Aex 883fd8d6ef
epic: refactor icons (#3492)
* refactor(components): el-alert icon (#3441)

* refactor(components): el-alert icon

* fix: el-alert test

* fix: [el-alert] lint error

* feat(utils): add icon util

* refactor(components): el-alert icon

* refactor(utils): icon

* test: update alert test

* refactor: remove el-icon in util

* refactor(components): el-notification icon (#3512)

* chore: temp save changes

* refactor: update icon

* fix: var

* docs: update icon

* fix: type class error

* style: remove unused class

* fix: update icon type

* docs: update icon

* fix: update iconComponent

* refactor(components): el-dialog icon (#3505)

* refactor(components): [el-dialog] icon

* fix: typo

* refactor: dialog icon ref

* refactor: dialog icon

* style: update close button size

* refactor(components): el-message-box icon (#3507)

* refactor(components): message-box icon

* refactor(components): message icon

* fix: test

* refactor: update ref

* fix: test

* docs: update icon

* fix: delete unused code

* docs: update type

* fix: update close button size

* fix: type

* fix: icon type class

* fix: icon type

* fix: update type class

* refactor(components): el-popconfirm icon (#3513)

* refactor(components): el-popconfirm icon

* fix: space styles

* docs: update example

* docs: update example for trigger event

* refactor(components): el-page-header icon (#3518)

* refactor(components): el-page-header icon

* docs: update icon

* fix: space errors

* refactor(components): el-steps icon (#3520)

* refactor(components): el-backtop icon (#3514)

* refactor(components): el-backtop icon

* fix: update font size

* refactor(components): el-button icon (#3536)

* refactor(components): el-button icon

* fix: update example

* refactor(components): el-button icon

* refactor: style simplify

Co-authored-by: imswk <syfzxx@vip.qq.com>

* refactor(components): el-tree icon (#3590)

Co-authored-by: qianjie <qianjie@patsnap.com>

* refactor(components): el-avatar icon (#3599)

Co-authored-by: qianjie <qianjie@patsnap.com>

* refactor(components): el-carousel icon (#3602)

Co-authored-by: qianjie <qianjie@patsnap.com>

* refactor(components): el-progress icon (#3607)

Co-authored-by: qianjie <qianjie@patsnap.com>

* refactor(components): el-result icon (#3609)

Co-authored-by: qianjie <qianjie@patsnap.com>

* refactor(components): el-timeline icon (#3646)

Co-authored-by: qianjie <qianjie@patsnap.com>

* refactor(components): el-table icon (#3611)

Co-authored-by: qianjie <qianjie@patsnap.com>

* chore: add vue to gitignore

* fix: buildProp error

* refactor(components): el-pagination icon (#3605)

* test: el-menu deprecated icon font (#3794)

* test: el-loading deprecated icon font (#3795)

* chore: Update changelog 1.1.0-beta.20 (#3838)

* fix: about custom extension of table column (#3437)

* refactor(components): el-autocomplete icon (#3783)

* refactor(components): el-dropdown icon (#3517)

* refactor(components): el-dropdown icon

* fix: arrow down icon size

* style: revert

* fix: font-size

* refactor(components): el-link icon (#3538)

* refactor(components): el-link icon

* refactor: update example

* fix: import icons

* docs: add tip

* refactor: update link icon

* fix: icon align

* fix: typo

* refactor(components): el-select icon (#3780)

* refactor(components): el-input icon (#3565)

* refactor(components): input icon

* docs: update example

* refactor(components): el-select icon

* docs: icon usage

* fix: input style

* fix: add scoped

* docs: fix icon

* fix: icon align

* fix: icon align

* fix: typo

* fix: typo

* refactor(components): el-input-number icon (#3566)

* refactor(components): el-input-number icon

* fix: icon align

* refactor(components): el-tag icon (#3793)

* refactor(components): el-tag icon

* fix: icon align

* fix: icon margin

* refactor(components): el-switch icon (#3787)

* refactor(components): el-switch icon

* fix: icon align

* docs: add icon usage

* refactor(components): el-collapse icon (#3788)

* refactor(components): el-collapse icon

* docs: update icon demo

* fix: typo

* refactor(components): el-uplod icon (#3598)

* refactor(components): el-uplod icon

* docs: update icon useage

* docs: fix icon

* docs: fix icon

* docs: update upload-filled icon

* fix: icon align

* fix: item icon align

* refactor(components): el-select-v2 icon (#3781)

* refactor(components): el-select-v2 icon

* revert: play/main.ts

* fix: icon style

* fix: icon solt

* refactor(components): el-cascader icon (#3785)

* refactor(components): input icon

* docs: update example

* refactor(components): el-select icon

* refactor(components): el-cascader icon

* refactor(components): el-tag icon

* fix: icon align

* fix: icon margin

* docs: icon usage

* fix: input style

* fix: add scoped

* test: remove unuesd code

* fix: cascader-panel

* fix: icon style

* fix: icon animation

* refactor(components): el-drawer icon (#3796)

* refactor(components): el-drawer icon

* fix: close icon size

* fix: close icon align

* refactor(components): el-transfer icon (#3792)

* refactor(components): el-transfer icon

* fix: icon align

* refactor(components): el-image-viewer icon (#3797)

* refactor(components): el-image-view icon

* fix: icon size

* docs: update domo

* style: format vue

* fix: fullscreen icon

* Add cursor for icons

Co-authored-by: jeremywuuuuu <15975785+JeremyWuuuuu@users.noreply.github.com>

* refactor(components): rate-icon (#3891)

* refactor(components): el-rate icon

* docs: update example

* docs: update

* test: update

* docs: update

* fix: variable rename

* fix: demo update

* fix: allow half bug

* refactor(components): el-time-picker icon (#3834)

* refactor(components): el-button icon

* refactor(components): date-picker icon

* refactor(components): input icon

* docs: update example

* refactor(components): el-select icon

* refactor(components): el-time-select icon

* fix: icon width

* docs: icon usage

* fix: input style

* fix: add scoped

* fix: icon size

* docs: icon display

* fix: icon in button

* docs: fix error

* refactor(components): el-time-picker icon

* fix: var

* fix: icon align

* test: delete unused code

* test: fix error

* fix: remove unused code

* docs: fix typo

* docs: update icon

* fix: default prefix icon

* fix: range picker icon align

* Update cursor for picker

Co-authored-by: jeremywuuuuu <15975785+JeremyWuuuuu@users.noreply.github.com>

* fix(components): el-input close icon

* chore: delete fonts

* fix: copy full style

Co-authored-by: imswk <syfzxx@vip.qq.com>
Co-authored-by: bastarder <85257684@qq.com>
Co-authored-by: qianjie <qianjie@patsnap.com>
Co-authored-by: Element <wallement@gmail.com>
Co-authored-by: Alan Wang <948467222@qq.com>
Co-authored-by: jeremywuuuuu <15975785+JeremyWuuuuu@users.noreply.github.com>
2021-10-27 23:17:13 +08:00

3.4 KiB

title lang
TimeSelect en-US

TimeSelect

Use Time Select for time input.

Fixed time picker

Provide a list of fixed time for users to choose.

:::demo Use el-time-select label, then assign start time, end time and time step with start, end and step.

time-select/basic

:::

Fixed time range

If start time is picked at first, then the end time will change accordingly.

:::demo

time-select/time-range

:::

Attributes

Attribute Description Type Accepted Values Default
model-value / v-model binding value string
disabled whether TimeSelect is disabled boolean false
editable whether the input is editable boolean true
clearable whether to show clear button boolean true
size size of Input string medium / small / mini
placeholder placeholder in non-range mode string
name same as name in native input string
prefix-icon Custom prefix icon component string / Component Clock
clear-icon Custom clear icon component string / Component CircleClose
start start time string 09:00
end end time string 18:00
step time step string 00:30
min-time minimum time, any time before this time will be disabled string 00:00
max-time maximum time, any time after this time will be disabled string

Events

Event Name Description Parameters
change triggers when user confirms the value component's binding value
blur triggers when Input blurs component instance
focus triggers when Input focuses component instance

Methods

Method Description Parameters
focus focus the Input component
blur blur the Input component