【Vue.js2】日付型を文字列型(YYYY-MM-DD)の書式に変換する

日付データの変換によくmoment.jsやday.jsなどが使われていますが、今回はライブラリを使用しない方法を紹介いたします。

v-modelで入ってきた値をcomputedで変換しています。

<template>
  <div>
    <input type="date" v-model="dateValue">
    {{ customFormat }}
  </div>
</template>

<script>

export default {
  data() {
    return {
      dateValue: "",
    };
  },
  computed:{
    customFormat(){
      const dateValue = this.dateValue;
      if(dateValue !== "") {
        let y = dateValue.getFullYear();
        let m = ('00' + (dateValue.getMonth()+1)).slice(-2);
        let d = ('00' + dateValue.getDate()).slice(-2);
        return (y + '-' + m + '-' + d);
      }
    }
  }
};
</script>

コメントを残す

入力エリアすべてが必須項目です。メールアドレスが公開されることはありません。

内容をご確認の上、送信してください。