Home  >  Article  >  Web Front-end  >  How to convert timestamp to time in vue.js

How to convert timestamp to time in vue.js

藏色散人
藏色散人Original
2020-11-10 10:39:278227browse

Vue.js method to convert timestamps into time: first install the moment plug-in; then introduce the moment plug-in in the [main.js] file; finally, directly reference dateFormat to convert the timestamp.

How to convert timestamp to time in vue.js

The operating environment of this tutorial: windows10 system, vue2.9, this article is applicable to all brands of computers.

Recommended: "vue.js Tutorial"

Time stamp is OK Understood as a way of filtering, date format conversion is often encountered in projects. Today I will summarize the pitfalls I have encountered in the project and the solutions.

There are three ways to convert timestamp to date format:

Method 1

  1. Run cmd Execute npm install moment --save or yarn add moment command to install the moment plug-in
  2. Introduce the moment plug-in in the main.js file and define a global filter
    How to convert timestamp to time in vue.js3. In subsequent components , if you need to convert the timestamp, you can directly reference the dateFormat
    引用dateFormat

Method 2

  1. Define one directly in the main.js file Global filter
Vue.filter('dateFormat', function(originVal) {
  const dt = new Date(originVal)
  const y = dt.getFullYear()
  const m = (dt.getMonth() + 1 + '').padStart(2, '0')
  const d = (dt.getDate() + '').padStart(2, '0')
  const hh = (dt.getHours() + '').padStart(2, '0')
  const mm = (dt.getMinutes() + '').padStart(2, '0')
  const ss = (dt.getSeconds() + '').padStart(2, '0')
  //时间格式年月日、时分秒  return `${y}-${m}-${d} ${hh}:${mm}:${ss}`})
  1. When needed later, use dateFormat directly
    How to convert timestamp to time in vue.js

Method three

HTML:
How to convert timestamp to time in vue.js
Js:

timestampToTime (time) {// How to convert timestamp to time in vue.js为10位需*1000,How to convert timestamp to time in vue.js为13位的话不需乘1000
      var date = new Date(time * 1000) 
      let y = date.getFullYear()
      let MM = date.getMonth() + 1
      MM = MM < 10 ? (&#39;0&#39; + MM) : MM      let d = date.getDate()
      d = d < 10 ? (&#39;0&#39; + d) : d      let h = date.getHours()
      h = h < 10 ? (&#39;0&#39; + h) : h      let m = date.getMinutes()
      m = m < 10 ? (&#39;0&#39; + m) : m      let s = date.getSeconds()
      s = s < 10 ? (&#39;0&#39; + s) : s      return y + &#39;年&#39; + MM + &#39;月&#39; + d + &#39;日&#39;}

Related free learning recommendations: JavaScript(video)

The above is the detailed content of How to convert timestamp to time in vue.js. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn