在Web開發中，顯示日期和時間是非常普遍的事情。Vue提供了內置的日期和時間格式化工具，使得處理日期和時間數據非常容易。

// 日期格式化
Vue.filter('dateFormat', function(date){
if(!date) return ''
return moment(date).format('YYYY-MM-DD')
})
// 時間格式化
Vue.filter('timeFormat', function(time){
if(!time) return ''
return moment(time).format('HH:mm')
})

我們可以通過filters來將日期和時間數據格式化為我們需要的樣式。Vue內置的日期過濾器是date，時間過濾器是time。

// Date
{{ new Date().toLocaleDateString() }}
{{ new Date().toLocaleString() }}
// Time
{{ new Date().toLocaleTimeString() }}
{{ new Date().toTimeString() }}

如果我們只是想讓Vue格式化日期和時間數據，那我們可以使用內置的Date對象。這里需要注意的是，這些函數返回的日期和時間取決于設備內部的時區和語言設置。

// 使用moment.js格式化日期
Vue.filter('dateFormat', function(date){
if(!date) return ''
return moment(date).format('MMM Do YYYY')
})
// 使用moment.js格式化時間
Vue.filter('timeFormat', function(time){
if(!time) return ''
return moment(time).format('h:mm:ss a')
})

如果我們需要更復雜的日期和時間格式化，我們可以使用moment.js。它是一個流行的JavaScript日期庫，提供了各種各樣的格式化和處理日期和時間的方法。

{{ new Date().toLocaleString('fr-FR', { timeZone: 'UTC' }) }}
{{ new Date().toLocaleDateString('fr-FR', { timeZone: 'UTC' }) }}
{{ new Date().toLocaleTimeString('fr-FR', { timeZone: 'UTC' }) }}

我們還可以使用toLocaleString()、toLocaleDateString()、toLocaleTimeString()函數來設置日期和時間的格式以及時區。這些函數返回的日期和時間取決于傳入的語言設置。