examples/pick-time.jsx

   1 import '../component/timepicker/assets/index.less';
   2
   3 import React from 'react';
   4 import ReactDom from 'react-dom';
   5 import zhCn from 'gregorian-calendar/lib/locale/zh_CN';
   6 import GregorianCalendar from 'gregorian-calendar';
   7
   8 import TimePicker from '../component/timepicker/src/Picker';
   9 import TimePanel from '../component/timepicker/src/TimePanel';
  10 import TimepickerLocale from '../component/timepicker/src/locale/zh_CN';
  11 import DateTimeFormat from 'gregorian-calendar-format';
  12
  13 const formatter = new DateTimeFormat('HH:mm:ss');
  14
  15 const now = new GregorianCalendar(zhCn);
  16 now.setTime(Date.now());
  17
  18 const timePanel = (
  19   <TimePanel
  20     defaultValue={now}
  21     locale={TimepickerLocale}
  22     formatter={formatter}
  23     minuteOptions={[0, 30]}
  24   />
  25 );
  26
  27 ReactDom.render(
  28   <TimePicker panel={timePanel} value={now}>
  29     {
  30       ({value}) => {
  31         return <input type="text" placeholder="请选择时间" readOnly value={value && formatter.format(value)} />;
  32       }
  33     }
  34   </TimePicker>,
  35   document.getElementById('react-content')
  36 );