InlineDatePickerとは
material-ui-pickersモジュールが提供するモダンな日程入力コンポーネント.
導入環境
npx create-react-app
でスターターキット使いました.
.js
import { MuiPickersUtilsProvider, InlineDatePicker } from "material-ui-pickers";
import DateFnsUtils from "@date-io/date-fns";
MaterialUIからのモジュール読み込み.
.js
<MuiPickersUtilsProvider utils={DateFnsUtils}>
<InlineDatePicker
label="ライブ日程"
format="yyyy/MM/dd"
onChange={date => this.handleDateChange(date+input)}
value={this.state.selectedDates[input]}
/>
</MuiPickersUtilsProvider>
InlineDatePickerの呼び出し.
躓いた点
これ,普通にモジュールインストールを
yarn add モジュール
みたいにしてると最新版がインストールされてしまい,なぜか最新版@date-ioはエラーを吐きます.
解決法
package.json
"@date-io/date-fns": "^1.3.13"
でバージョン1.3.13で指定.これで上手くいきます.
参考:https://stackoverflow.com/questions/59600125/cannot-get-material-ui-datepicker-to-work
疑問
一番上の画像でもあるようにDatePickerウィンドウ内の言語は英語になっています.これ日本語にすることって可能ですかね?だれか教えていただけると嬉しいです〜