Vue

by ken3desu

HTML

<div id="app">
  {{create_date_string}}
</div>

CSS

body {
  background: #20262E;
  padding: 20px;
  https://jsfiddle.net/user/settings/font-family: Helvetica;
}

#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  transition: all 0.2s;
}

Vue

new Vue({
  el: "#app",
  computed:{
    create_date_string:function(){
      const now = new Date();
      const options = {
        //era:"narrow", //"narrow","short", "long"
        year: 'numeric',//"numeric", "2-digit"
        month: '2-digit',//"numeric", "2-digit", "narrow", "short", "long"
        day: '2-digit',//"numeric", "2-digit"
        weekday:"narrow", //"narrow","short", "long"
        hour: '2-digit',//"numeric", "2-digit"
        minute: '2-digit',//"numeric", "2-digit"
        second: '2-digit',//"numeric", "2-digit"
        timeZone: 'Asia/Tokyo',//"America/New_York"
      };
      return now.toLocaleDateString('japanese', options).replace(/\//g, '-');
    },
  }
})