标签：实例 message name 添加 过滤器 src template one 接收参数
<!-- 在双花括号中 --> {{ message | capitalize }} <!-- 在 `v-bind` 中 --> <div v-bind:id="rawId | formatId"></div>
App.vue ：
<template>
<div id="app">
<!-- 使用 capitalize 过滤器 -->
{{ name | capitalize}}
</div>
</template>
<script>
// 导入组件
import Learn from "./components/Learn"
export default {
name: "App",
components: {
Learn // 注入
},
data() {
return {
name: "java"
}
},
// 局部过滤器，仅当前实例有效
filters: {
// 定义一个将首字母转换为大写的过滤器
capitalize: function(value) {
if (!value) return ‘‘
value = value.toString();
return value.charAt(0).toUpperCase() + value.slice(1)
}
}
};
</script>
或者在创建 Vue 实例之前全局定义过滤器：
Vue.filter(‘capitalize‘, function (value) { if (!value) return ‘‘ value = value.toString() return value.charAt(0).toUpperCase() + value.slice(1) }) new Vue({ // ... })
当全局过滤器和局部过滤器重名时，会采用局部过滤器。
过滤器可以串联：
{{ message | filterA | filterB }}
{{ message | filterA(‘arg1‘, arg2) }}
标签：实例 message name 添加 过滤器 src template one 接收参数
原文地址：https://www.cnblogs.com/d0usr/p/12563429.html
