Vueは右上隅の時間表示のリアルタイム更新を実装します

エクスポートデフォルト{
  // 右上隅のタイムスタンプを取得します formatDate(time) {
    newTime = "" とします。
    date = new Date(time); とします。
    let a = new Array("日","MON","TUE","WED","THUR","FRI","SAT");
    年 = date.getFullYear() とします。
        month = date.getMonth()+1, //月は0から始まります day = date.getDate(),
        時間 = date.getHours(),
        分 = date.getMinutes(),
        秒 = date.getSeconds(),
        week = 新しいDate().getDay();
        時間<10の場合{
          時間 = "0"+時間;
        }
        最小値<10の場合{
          min = "0" +分;
        }
        （秒<10）の場合{
          秒 = "0"+秒;
        }
    newTime = 年 + "-"+月+"-" +日 +"週"+a[週] + " "+時間+":"+分+":"+秒;
    新しい時刻を返します。
  }
}

<テンプレート>
  <div class="main">   
    <!-- ヘッダー -->
    <div class="header">     
      <div class="cue_time">{{現在の日付}}</div>
    </div>
  </div>
</テンプレート>
 
<スクリプト>
  '../utils/index' から utils をインポートします 
  エクスポートデフォルト{
    名前:"トランニン",
    データ （） {
      戻る {       
        現在の日付: utils.formatDate(新しい日付())、
        currentDateTimer:null, //ヘッダーの現在の時刻}
      
    },
    方法:{
      // ヘッダー時間を更新する refreshCurrentTime(){
        this.currentDate = utils.formatDate(新しい日付())
      }
 
    },
    マウントされた(){
      // 時間指定の更新時間 this.currentDateTimer = setInterval(this.refreashCurrentTime,1000)
 
    }
  }
</スクリプト>