Vuetifyのdatepickerを使って【和暦】＋【年度/月】pickerを作ってみた - Qiita
vuetifyのv-date-pickerは、表面上のテキストをfuncitionで書き換えることができるので【和暦表示】と【年度/月】が選択できるピッカーを作ってみました。 0.5x倍にしてみると普通に見れると思います。 See the Pen WarekiDatePicker by BigFly3 (@bigfly3) on CodePen. 本来やらないような操作したときに稀にエラーになるかもしれませんが、公式のもおかしな感じになるのでそこは無視してください。 親からも和暦情報が取れます ピッカーだけ和暦になっても、コンポーネントの連携での恩恵が薄いので、@changeの際にオブジェクトで和暦情報を送るようにしています。 データについて v-modelでセットされるデータは普通のピッカーと同様（YYYY-MM-DD）です. 和暦のオブジェクトに関してはcodepenの日付を選択しても
Vue.js で Moment.js を使ってお手軽に日付フォーマットする - Qiita
Vue.js のフィルタでフォーマット Moment.js を使ったフィルタを用意すると以下のようにお手軽に日付のフォーマットが可能です。 JavaScript の日付処理は罠が多い Date#getYearで1900年からの経過年数が返る Date#getMonthで 0 ～ 11 が返る。 JavaScript の日付処理ライブラリである Moment.js を使えばそういった罠を回避し、お手軽に JavaScript の日付を扱うことができます。 現在、Github のスターは 40000 を超え JavaScript の日付処理ライブラリでは最もメジャーなものの一つです。 フィルタの作り方 サンプルプロジェクトを作成します。 既存のプロジェクトに組み込む場合、ここは必要ありません。 # Vue CLI のインストール ※すでにインストール済みなら必要なし $ npm install
v-text-fieldとDatePickerを組み合わせる - こーひーエンジニアブログ
v-menuを使ってv-text-fieldとDatePickerを組み合わせる <v-menu v-model="menu" max-width="290px" min-width="290px"> <!-- ポップアップを追加する要素にv-on="on" --> <template v-slot:activator="{ on }"> <v-text-field slot="activator" v-model="fromDate" label="fromDate" readonly v-on="on" /> </template> <!-- ポップアップされる内容--> <v-date-picker v-model="fromDate" /> </v-menu> こんな感じに実装することが出来ました。 v-text-fieldはreadOnlyでv-date-pickerと同じv-m
VuetifyのDatepickerの値が消えない - Qiita
VuetifyのDatepicker、すごく便利なんだけど、v-text-fieldと一緒に使った時によく使うclearableで値が消えないなーと思っていたメモ。 何したのか v-text-fieldに@click:clear="date = null"を追加した。 コードは公式サンプルを利用 https://vuetifyjs.com/en/components/date-pickers#date-pickers-formatting-date-using-external-libs <template> <v-menu v-model="menu1" :close-on-content-click="false" full-width max-width="290" > <template v-slot:activator="{ on }"> <v-text-field :value
VuetifyのDate Pickerを日本語化したら"日"ってついてくる、やだキモい - nanisore oishisou
長い前置き（飛ばし読み推奨） 最近、フロント側を完全に脱jQueryして、Vue.js + Vuex + VueRouter + Vuetifyで開発を進めている。 これまでもVue.js + Vuex この２つは使っていたわけなんだけど bootstrapベースであるAdminLTEと組み合わせることに限界を感じていて、 それぞれの開発者がVueライブラリを探して入れてみたり、 自作してみたりみたいなことを、それぞれの案件で繰り返していたわけだ。 心の声（もう、こんなお飾りのjQuery依存のUIフレームワークなんて実際は足枷じゃねーか。確かにデザインは綺麗なんだけど。。） そこで出会ったのがVuetify。 少し使い込んでみた感じ、グリッドレイアウトにflexboxを採用しているので レイアウトに苦戦することもあるけど、それだって新しいbootstrap4も同じだし もはや、これが時代
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【サンプルあり】Vuetify で DatePicker付きの テキストフィールドを作る！【v-date-picker】｜ProgLearn｜エンジニアのためのプログラミング情報メディア
