【vue】定义一个局部过滤器的demo


一、定义一个局部转化时间的过滤器

filters: {
        formatDate(time) {
            var formatDate = function (date, fmt) {
                if (/(y+)/.test(fmt)) {
                    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
                }
                let o = {
                    'M+': date.getMonth() + 1,
                    'd+': date.getDate(),
                    'h+': date.getHours(),
                    'm+': date.getMinutes(),
                    's+': date.getSeconds()
                }
                for (let k in o) {
                    if (new RegExp(`(${k})`).test(fmt)) {
                        let str = o[k] + ''
                        fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str))
                    }
                }
                return fmt
            }

            function padLeftZero(str) {
                return ('00' + str).substr(str.length)
            }
            time = time * 1000     //注意:time应为格式为13位unix时间戳,如果是10位的unix时间戳,需要乘以1000
            let date = new Date(time)
            return formatDate(date, 'yyyy年MM月dd日')
        }
    },

二、书写位置

 三、应用

1、页面中应用

<span>{{ computedData.start_time | formatDate}} - {{ computedData.end_time | formatDate}}span>

2、在methods方法中使用

this.$options.filters['formatDate'](this.orderInfoList.end_time)
vue