[frontend] コンテスト作成時の開始時間、終了時間にテキストボックスを使うのをやめる

[ShopOne]

基本僕(と開発者)しか使わないので実装をサボって放っておいてましたが、直したい部分なので生やしました。

[ShopOne]

名前よく知らないですが、TimePicker？とかいうのを使うと良いのかなと思います。

[no-yan]

TimePickerはちょっと微妙かもしれません。 Reactは仮想DOMを使って差分比較をして、必要な分だけを本当のDOMを編集しているので、直接DOMを操作する系統と相性が悪い可能性があります。仮想DOMでは何も起こってないけど、編集しようとしたら実はこの部分が消えてて操作できないとか。

雑にいうと、考えることが多くなって嫌だなあという気持ちと、もし大変になる要素を許容するならそのリソースを割くのは別のどこかだろうという気持ちです。 参照：これ や これ

[no-yan]

すこし良さそうなライブラリを調べてみます。

[no-yan]

遅くなりました（三ヶ月！すみません！）が、datetime-localに変更するのはどうでしょうか？

長所・短所

pros

• カレンダーから選択できるようになる
• Date.parse() ができるため、導入時にロジックへの影響がない
• 一行変更するだけでよい
• ブラウザが実装しているので、個々のライブラリより信頼できる

cons

• 秒までの指定が不可能になる
• アニメーション等がなく、多少ダサい

他の候補として、@material-ui/pickersなどがあります。こちらはアニメーションがあり、秒数の指定も可能です。

比較画像

右：type="datetime" 左：type="datetime-local"で比較しました。

[ShopOne]

おお〜 ありがとうございます！ ダサさについては、本番環境では僕しか使わないので大丈夫です 秒数指定もあんまり使う機会ないので良さそうです