質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Q&A

解決済

1回答

3890閲覧

Vue.jsのvuejs-datepickerのフォーマットを変更したい。

Anon_

総合スコア334

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

0グッド

0クリップ

投稿2021/12/15 01:26

下記のvuejs-datepickerを使用しています。
https://github.com/charliekassel/vuejs-datepicker

下記のサイトを参考に、formatをyyyy-MM-ddに変更しようとしているのですがinputの中身のformatが変わりません。
https://www.kabanoki.net/2560/

実際のコードは下記です。
どこか間違っている箇所はあるでしょうか。。

<div class="date_select"> <vuejs-datepicker name="reserve_date" :format="DatePickerFormat" v-model="reserve_date" :language="ja" :inline="true"></vuejs-datepicker> <input type="text" :value="reserve_date"> </div> <script src="https://unpkg.com/vue@2.6.14/dist/vue.min.js"></script> <script src="https://unpkg.com/vuejs-datepicker"></script> <script src="https://cdn.jsdelivr.net/npm/vuejs-datepicker@1.6.2/dist/locale/translations/ja.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js" defer></script> <script> new Vue({ el:"#app", data: { ja: vdp_translation_ja.js, DatePickerFormat: 'yyyy-MM-dd', reserve_date: '', }, components: { 'vuejs-datepicker':vuejsDatepicker }, methods: { customFormatter(date) { return moment(date).format('YYYY/MM/DD'); }, } }) </script>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

:inline外したらわかると思うのですが:formatの値は
vuejs-datepikerに付属するinputの『見え方』に対して有効なのであって
v-modelに対して有効なのではないと思います。v-modelには
object dateとして入っているため自力で変換が必要です。

投稿2021/12/15 02:24

sousuke

総合スコア3828

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Anon_

2021/12/15 02:31

あぁ!そういう事でしたか! 最速で正確な回答をありがとうございます。 とても助かりました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問