美文网首页
vue使用全局filter方法骚操作

vue使用全局filter方法骚操作

作者: 0说 | 来源:发表于2019-06-20 11:16 被阅读0次

文件filters.js

const filters = {
    /**
     * 功能:将时间戳按照给定的 时间/日期 格式进行处理
     * @param {Number} date 时间戳 
     * @param {String} fmtExp 时间格式 'hh:ss'
     * @returns {String} 规范后的 时间/日期 字符串
     */
    fmtDate: function(date, fmtExp) {
        var date = new Date(date)
        var o = {
            "M+": date.getMonth() + 1, //月份
            "D+": date.getDate(), //日
            "h+": date.getHours(), //小时
            "m+": date.getMinutes(), //分
            "s+": date.getSeconds(), //秒
            "q+": Math.floor((date.getMonth() + 3) / 3), //季度
            "S": date.getMilliseconds() //毫秒
        };
      
        
        if (/(y+)/.test(fmtExp)){
            fmtExp = fmtExp.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
            console.log(fmtExp);
        }
        for (var k in o)
            if (new RegExp("(" + k + ")").test(fmtExp))
                fmtExp = fmtExp.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        return fmtExp;
    }
}
export default (Vue) => {
    Object.keys(filters).forEach(key => {
        Vue.filter(key, filters[key])
    })
}

uve main.js

import Vue from 'vue'
import filters from './filters' //将全部过滤器放在 filters/index.js 中便于管理
//技巧 同时 use 多个插件 被依赖的插件应放在偏后方
filters(Vue )

组件应用

<!--使用过滤器 fmtDate 格式化时间 把想要的格式传进去-->
<div class="desc-time">{{item.msg[item.msg.length-1].date | fmtDate('yyyy-MM-DD hh:mm:ss')}}</div>

相关文章

网友评论

      本文标题:vue使用全局filter方法骚操作

      本文链接:https://www.haomeiwen.com/subject/fgrdqctx.html