vue3時間戳轉換(不使用過濾器)
vue2轉換時間戳的時候一般使用過濾器的方式,到vue3之後,vue3移除瞭過濾器,就不能再用瞭,官方是推薦使用方法或者計算屬性的方式。
下面寫瞭一個Time.ts的文件,可以針對時間戳進行轉換:
class Time { // 格式化時間 public formatTime(time: number) { let date = new Date(time * 1000); let year = date.getFullYear(); let month = date.getMonth() + 1; let day = date.getDate(); let hour = date.getHours(); let minute = date.getMinutes(); let second = date.getSeconds(); return year + "-" + month.toString().padStart(2, "0") + "-" + day.toString().padStart(2, "0") + " " + hour.toString().padStart(2, "0") + ":" + minute.toString().padStart(2, "0") + ":" + second.toString().padStart(2, "0"); } } const time = new Time(); export default time;
使用的話,隻要在模板調用這個方法,然後傳入對應的時間戳就可以瞭。
{{ time.formatTime(timestamp) }}
顯示的效果:
2021-05-17 10:59:59
目前隻能轉換成如上格式,如果需要更多的格式,可以在formatTime
增加第2個參數,表示格式化的時間格式,然後依著轉化就行瞭。
到此這篇關於vue3時間戳轉換(不使用過濾器)的文章就介紹到這瞭,更多相關vue3時間戳轉換內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet!
推薦閱讀:
- JS時間戳轉換方式示例詳解
- JS時間戳轉換為常用時間格式的三種方式
- JavaScript中時間格式化新思路toLocaleString()
- JavaScript 實現日期時間轉時間戳
- vue2實現簡易時鐘效果