1.全局使用在main.js中
//全局 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}` })2.局部使用
//局部 <template> <div id="app"> <p>价格{{price | currency}}</p> <p>时间:{{timestamp | format('YYYY-MM-DD')}}</p> </div> </template> <script> import moment from 'moment'; export default{ filters:{ currency:function(value){ if(!value) return 0.0; return `¥${value.toFixed(2)}元`; //保留两位小数 }, format(value , formatter){ return moment(value).format(formatter); } }, data(){ return{ price:50 } } } </script>使用竖线“|”去使用过滤器