关于vue.js:Vue过滤器

46次阅读

共计 596 个字符，预计需要花费 2 分钟才能阅读完成。

格式化数据，比方将字符串格式化为字母大写，日期格局等

自定义过滤器


// 字母转大写
Vue.filter('toUpperCase', function(val){return val.toUpperCase();
});
// 字母转小写
Vue.filter('toLowerCase', function(val){return val.toLowerCase();
});

应用自定义过滤器

<div>{{msg | toUpperCase}}</div>
// 这种形式上一个过滤后的输入值是下一个过滤器的传入值
<div>{{msg | toUpperCase | toLowerCase}}</div>
<div :id="id | toUpperCase"></div>

部分过滤器，VUE 示例中 filters 中增加过滤的办法

filters: {toUpperCase: function(val){return val.toUpperCase();
    }
}

带参数的过滤器

// 格式化工夫
Vue.filter('format', function(val,type){formatDate = val.getFullYear() + "-" + (val.getMonth()+1) + "-" val.getDate();
    return val.toUpperCase();});
<div>{{date | format('yyyy-MM-dd') }}</div>

正文完