Vue2，过滤器的使用详解

过滤器

Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符号指示：

<!-- 在双花括号中 -->
{{ message | capitalize }}

<!-- 在 `v-bind` 中 -->
<div v-bind:id="rawId | formatId"></div>

在创建 Vue 实例之前全局定义过滤器：

    //全局过滤器
    Vue.filter("timeFormat", (val) => {
        let time = new Date(val)
        let year = time.getFullYear()
        let month = time.getMonth() + 1
        let day = time.getDate();
        return year + "年" + month + "月" + day + "号"
    })

局部定义：

   const app=new Vue({
        el:'#app',
        data:{
        time:'2022-02-16'
        },
        filters:{
            timeFormat(val){
                let time = new Date(val)
                    let year = time.getFullYear()
                    let month = time.getMonth() + 1
                    let day = time.getDate();
                    return year + "年" + month + "月" + day + "号"
            }
        }
    })