Element UI 的時(shí)間及日期選擇器

TimePicker 時(shí)間選擇器

用于選擇或輸入日期。

  • 固定時(shí)間點(diǎn)
    提供幾個(gè)固定的時(shí)間點(diǎn)供用戶選擇稼病。
    使用 el-time-select 標(biāo)簽惕橙,分別通過(guò)start、end和step指定可選的起始時(shí)間纹份、結(jié)束時(shí)間和步長(zhǎng)。



  • 任意時(shí)間點(diǎn)
    可以選擇任意時(shí)間廷痘。
    使用 el-time-picker 標(biāo)簽蔓涧,通過(guò)selectableRange限制可選時(shí)間范圍。提供了兩種交互方式:默認(rèn)情況下通過(guò)鼠標(biāo)滾輪進(jìn)行選擇笋额,打開(kāi)arrow-control屬性則通過(guò)界面上的箭頭進(jìn)行選擇元暴。



  • 固定時(shí)間范圍
    若先選擇開(kāi)始時(shí)間,則結(jié)束時(shí)間內(nèi)備選項(xiàng)的狀態(tài)會(huì)隨之改變兄猩。



  • 任意時(shí)間范圍
    可選擇任意的時(shí)間范圍茉盏。
    添加is-range屬性即可選擇時(shí)間范圍,同樣支持arrow-control屬性枢冤。



  • Attributes




  • Time Select Options


  • Time Picker Options


  • Events


  • Methods


DatePicker 日期選擇器

用于選擇或輸入日期鸠姨。

  • 選擇日
    以「日」為基本單位,基礎(chǔ)的日期選擇控件淹真。
    基本單位由type屬性指定讶迁。快捷選項(xiàng)需配置picker-options對(duì)象中的shortcuts核蘸,禁用日期通過(guò) disabledDate 設(shè)置巍糯,傳入函數(shù)。



  • 其他日期單位
    通過(guò)擴(kuò)展基礎(chǔ)的日期選擇客扎,可以選擇周祟峦、月、年或多個(gè)日期徙鱼。



  • 選擇日期范圍
    可在一個(gè)選擇器中便捷地選擇一個(gè)時(shí)間范圍宅楞。
    在選擇日期范圍時(shí),默認(rèn)情況下左右面板會(huì)聯(lián)動(dòng)袱吆。如果希望兩個(gè)面板各自獨(dú)立切換當(dāng)前月份厌衙,可以使用unlink-panels屬性解除聯(lián)動(dòng)。



  • 選擇月份范圍
    可在一個(gè)選擇器中便捷地選擇一個(gè)月份范圍杆故。
    在選擇月份范圍時(shí)迅箩,默認(rèn)情況下左右面板會(huì)聯(lián)動(dòng)溉愁。如果希望兩個(gè)面板各自獨(dú)立切換當(dāng)前年份处铛,可以使用unlink-panels屬性解除聯(lián)動(dòng)饲趋。



  • 日期格式
    使用format指定輸入框的格式;使用value-format指定綁定值的格式撤蟆。
    默認(rèn)情況下奕塑,組件接受并返回Date對(duì)象。以下為可用的格式化字串家肯,以 UTC 2019年1月2日 03:04:05 為例:
    注:請(qǐng)注意大小寫(xiě)龄砰。





  • 默認(rèn)顯示日期
    在選擇日期范圍時(shí),指定起始日期和結(jié)束日期的默認(rèn)時(shí)刻讨衣。
    選擇日期范圍時(shí)换棚,默認(rèn)情況下,起始日期和結(jié)束日期的時(shí)間部分均為當(dāng)天的 0 點(diǎn) 0 分 0 秒反镇。通過(guò)default-time可以分別指定二者的具體時(shí)刻固蚤。default-time接受一個(gè)數(shù)組,其中的值為形如12:00:00的字符串歹茶,第一個(gè)值控制起始日期的時(shí)刻夕玩,第二個(gè)值控制結(jié)束日期的時(shí)刻。



  • Attributes




  • Picker Options


  • Shortcuts


  • Events


  • Methods


DateTimePicker 日期時(shí)間選擇器

在同一個(gè)選擇器里選擇日期和時(shí)間惊豺。
DateTimePicker 由 DatePicker 和 TimePicker 派生燎孟,Picker Options 或者其他選項(xiàng)可以參照 DatePicker 和 TimePicker。

  • 日期和時(shí)間點(diǎn)
    通過(guò)設(shè)置type屬性為datetime尸昧,即可在同一個(gè)選擇器里同時(shí)進(jìn)行日期和時(shí)間的選擇揩页。快捷選項(xiàng)的使用方法與 Date Picker 相同烹俗。



  • 日期和時(shí)間范圍
    設(shè)置type為datetimerange即可選擇日期和時(shí)間范圍碍沐。



  • 默認(rèn)的起始與結(jié)束時(shí)刻
    使用datetimerange進(jìn)行范圍選擇時(shí),在日期選擇面板中選定起始與結(jié)束的日期衷蜓,默認(rèn)會(huì)使用該日期的00:00:00作為起始與結(jié)束的時(shí)刻累提;通過(guò)選項(xiàng)default-time可以控制選中起始與結(jié)束日期時(shí)所使用的具體時(shí)刻。default-time接受一個(gè)數(shù)組磁浇,數(shù)組每項(xiàng)值為字符串斋陪,形如12:00:00,其中第一項(xiàng)控制起始日期的具體時(shí)刻置吓,第二項(xiàng)控制結(jié)束日期的具體時(shí)刻无虚。



  • Attributes




  • Picker Options


  • Shortcuts


  • Events


  • Methods


  • Slots


?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市衍锚,隨后出現(xiàn)的幾起案子友题,更是在濱河造成了極大的恐慌,老刑警劉巖戴质,帶你破解...
    沈念sama閱讀 212,454評(píng)論 6 493
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件度宦,死亡現(xiàn)場(chǎng)離奇詭異踢匣,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)戈抄,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,553評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門(mén)离唬,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人划鸽,你說(shuō)我怎么就攤上這事输莺。” “怎么了裸诽?”我有些...
    開(kāi)封第一講書(shū)人閱讀 157,921評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵嫂用,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我丈冬,道長(zhǎng)尸折,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,648評(píng)論 1 284
  • 正文 為了忘掉前任殷蛇,我火速辦了婚禮实夹,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘粒梦。我一直安慰自己亮航,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,770評(píng)論 6 386
  • 文/花漫 我一把揭開(kāi)白布匀们。 她就那樣靜靜地躺著缴淋,像睡著了一般。 火紅的嫁衣襯著肌膚如雪泄朴。 梳的紋絲不亂的頭發(fā)上重抖,一...
    開(kāi)封第一講書(shū)人閱讀 49,950評(píng)論 1 291
  • 那天,我揣著相機(jī)與錄音祖灰,去河邊找鬼钟沛。 笑死,一個(gè)胖子當(dāng)著我的面吹牛局扶,可吹牛的內(nèi)容都是我干的恨统。 我是一名探鬼主播,決...
    沈念sama閱讀 39,090評(píng)論 3 410
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼三妈,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼畜埋!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起畴蒲,我...
    開(kāi)封第一講書(shū)人閱讀 37,817評(píng)論 0 268
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤悠鞍,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后模燥,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體咖祭,經(jīng)...
    沈念sama閱讀 44,275評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡掩宜,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,592評(píng)論 2 327
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了心肪。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片锭亏。...
    茶點(diǎn)故事閱讀 38,724評(píng)論 1 341
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡纠吴,死狀恐怖硬鞍,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情戴已,我是刑警寧澤固该,帶...
    沈念sama閱讀 34,409評(píng)論 4 333
  • 正文 年R本政府宣布,位于F島的核電站糖儡,受9級(jí)特大地震影響伐坏,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜握联,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,052評(píng)論 3 316
  • 文/蒙蒙 一桦沉、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧金闽,春花似錦纯露、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,815評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至挤庇,卻和暖如春钞速,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背嫡秕。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,043評(píng)論 1 266
  • 我被黑心中介騙來(lái)泰國(guó)打工渴语, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人昆咽。 一個(gè)月前我還...
    沈念sama閱讀 46,503評(píng)論 2 361
  • 正文 我出身青樓遵班,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親潮改。 傳聞我的和親對(duì)象是個(gè)殘疾皇子狭郑,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,627評(píng)論 2 350

推薦閱讀更多精彩內(nèi)容