美文网首页
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