How to format time in vue

How to format time in vue

Introduction: This article explains how to format and display time in vue

code demo

<template>
    <div>
      <!-- 时间戳 -->
      <span>{
   
   { timestamp }}</span>
      <br>
      <!-- 格式化后的时间 -->
      <span>{
   
   { formattedTime }}</span>
    </div>
  </template>
  
  <script>
  export default {
      
      
    data() {
      
      
      return {
      
      
        timestamp: "2021-06-15T00:00:00.000+00:00",
      };
    },
    computed: {
      
      
      formattedTime() {
      
      
        const date = new Date(this.timestamp);
        const year = date.getFullYear();
        const month = ("0" + (date.getMonth() + 1)).slice(-2);
        const day = ("0" + date.getDate()).slice(-2);
        const hour = ("0" + date.getHours()).slice(-2);
        const minute = ("0" + date.getMinutes()).slice(-2);
        const second = ("0" + date.getSeconds()).slice(-2);
        return `${ 
        year}-${ 
        month}-${ 
        day} ${ 
        hour}:${ 
        minute}:${ 
        second}`;
      },
    }
  };
  </script>