过滤器(Filters)是 vue 为开发者提供的功能,常用于文本的格式化。过滤器可以用在两个地方:插值表达式和 v-bind 属性绑定。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道符”进行调用,示例代码如下:
<l--在双花括号中通过“管道符“调用capitalize过滤器,对message的值进行格式化-->
<p>{
{
message | capitalize }}</p>
<!--在v-bind 中通过“管道符”调用 formatId过滤器,对rawId的值进行格式化-->
<div v-bind:id="rawId| formatId"></div>
在创建 vue 实例期间,可以在 filters 节点中定义过滤器,示例代码如下:
const vm = new Vue({
el: '#app',
data: {
message: 'hello vue. js',
info: 'title info'
},
filters: {
// 在 filters 节点下定义“过滤器”
capitalize(str) {
//把首字母转为大写的过滤器
return str.charAt(0).toUpperCase(