Vue表格中時間的處理

Vue中表格的數據應該來自后台數據庫，然后從數據庫中讀取到的數據，時間格式可能有些不同，我們可以根據實際需要來對這個時間進行轉化。

 

這里介紹一個js庫，它提供了強大的日期處理功能，功能強大且只有2k大小。安裝方式簡單，只需要npm install fecha --save即可。

 

Formatting(日期格式化)

fecha提供一個format方法。fecha.format接收一個Date對象（或一個時間戳）和一個字符串形式的日期格式，然后返回一個字符串（處理后的日期）。

注意： 當傳入的參數無效時，fecha會報錯

 

Parsing(日期解析)

fecha另外提供了一個parse方法。和format類似，fecha.parse接收一個Date字符串和一個字符串形式的日期格式，然后返回一個Date對象。

注意： 當傳入的參數無效時，fecha會報錯

 

fecha還有其他很多功能，這里不做具體介紹，有興趣請自行百度學習。

 

這里放一個demo，以供參考。

 

html

<el-table-column prop="time" label="時間" :formatter="dateFormat" min-width="100"></el-table-column>

 

js

  methods: {
      dateFormat(row, column, cellValue) {
        return cellValue ? fecha.format(new Date(cellValue), 'YYYY-MM-DD') : '';
      }
    }

 

恩，就醬～