需求1：在雙大括號中處理時間格式
使用前：
<div v-for='item in orders' :key='item.id'>
日期：<div>{{item.orderTime}}</div>
狀態：<div>{{item.status}}</div>
<br>
</div>
使用前頁面效果：
使用後代碼：
<div v-for='item in orders' :key='item.id'>
日期：<div>{{item.orderTime | dateFormat}}</div>
狀態：<div>{{item.status}}</div>
<br>
</div>
全局註冊過濾器
Vue.filter('dateFormat',function(dateStr){
return moment(dateStr).format('YYYY-MM-DD');
})
使用後頁面效果：
需求2：在element-ui的table組件中處理時間格式
使用前代碼：
<el-table
:data="orders"
style="width: 100%">
<el-table-column
prop="orderTime"
label="日期">
</el-table-column>
<el-table-column
prop="status"
label="狀態">
</el-table-column>
<el-table-column
prop="total"
label="總額">
</el-table-column>
</el-table>
使用前頁面效果：
使用後代碼：
<el-table
:data="orders"
style="width: 100%">
<el-table-column
prop="orderTime"
:formatter="dateFormat"
label="日期">
</el-table-column>
<el-table-column
prop="status"
label="狀態">
</el-table-column>
<el-table-column
prop="total"
label="總額">
</el-table-column>
</el-table>
當前組件的methods中
methods:{
dateFormat(row,colnum){
// colnum爲使用了formatter的列
// clonum.property爲當前列的prop值
// row爲當前行，是一個類數組對象，可通過[]拿值
return moment(row[colnum.property]).format('YYYY-MM-DD')
},
}
使用後頁面效果：
說明：在element-ui的table組件中，自帶屬性formatter，用來格式化內容
