Vue中的过滤器(filter)

news/2024/7/10 0:34:03 标签: vue, 过滤器, filter, javascript, 小程序

过滤器的写法

首先,过滤器可在new Vue实例前注册全局的,也可以在组件上写局部。

全局过滤器

javascript">Vue.filter('globalFilter', function (value) {

return value + "!!!"

})

组件过滤器(局部):

javascript">filters:{

componentFilter:function(value){

return value + "!!!"

}

}

上面有种写法有个需要注意的问题:全局注册时是filter,没有s的。而组件过滤器filters,是有s的,这要注意了,虽然你写的时候没有s不报错,但是过滤器是没有效果的

过滤器的使用方法

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

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

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


http://www.niftyadmin.cn/n/1527294.html

相关文章

Wireshark Limit each packet to 80 bytes

今天在winxp中安装了1.10.7 版本wireshark来做一个试验&#xff0c;试验中我只需要抓TCP和IP包&#xff0c;所以要在Wireshark: Capture Options的窗口中把每个数据包的大小&#xff08;就是Limit each packet to&#xff09;限制为80字节&#xff0c;按ctrlK调出Wireshark: Ca…

Vue中的scoped

什么是scoped 在vue文件中的 style 标签上&#xff0c;有一个特殊的属性&#xff1a;scoped。当一个 style 标签拥有 scoped 属性时&#xff0c;它的 CSS 样式就只能作用于当前的组件&#xff0c;也就是说&#xff0c;该样式只能适用于当前组件元素。通过该属性&#xff0c;可…

WIN10 PING不通 开启防火墙ICMP回显

今天在Windows防火墙→高级设置→入站规则→文件和打印机共享&#xff08;回显请求 - ICMPv4-In&#xff09;→在【已启用】上打勾后还是没有icmp回显。经过一翻努力的查找和试探&#xff0c;终于找到了另一个回显请求。那就是虚拟机监控(回显请求-ICMPv6-In),见下图。开启了虚…

Vue中$bus事件总线

不说废话&#xff0c;直接看用法&#xff1a; 1、在 main.js 中将 $bus 绑定到 vue 原型上 Vue.prototype.$busnew Vue() 2、在需要传递信息的组件上将一个方法发射出去&#xff0c;并需要在某个条件激活这个方法 <div click"busclick"> </div> meth…

Vue核心知识总结(超级经典,实时更新)

喜欢的小伙伴点赞收藏哦1、Vue基础入门1.1、脚手架环境安装Vue1.2、创建Vue项目1.3、精简项目代码2、Vue的核心概念2.1、指令2.1.1、文本指令2.1.2、流程控制2.1.3、显示与隐藏2.1.4、属性绑定2.1.5、事件处理2.1.6、表单绑定2.1.7、编译处理2.1.8、插槽2.2、选项2.2.1、数据选…

安装程序无法自动安装Virtual Machine Communication Interface Sockets(VSock)驱动程序

关于 VMware Tools安装时出现的问题的解决办法&#xff1a; 安装时出现问题对话框&#xff1a; 安装程序无法自动安装Virtual Machine Communication Interface Sockets&#xff08;VSock&#xff09;驱动程序。必须手动安装此驱动程序 可以通过安装windows更新解决&#xf…

华为路由器交换机快捷键大全

彩色快捷键是我最喜欢用的4个。 CTRL_A 将光标移动到当前行的开头。 CTRL_B 将光标向左移动一个字符。 CTRL_C 停止当前正在执行的功能。 CTRL_D 删除当前光标所在位置的字符。CTRL_E 将光标移动到当前行的末尾。 CTRL_F 将光标向右移动一个字符。 CTRL_H 删除光标左侧的一个…

开启windows 10的远程桌面服务

windows操作系统中有一个远程桌面服务&#xff0c;很好用。今天介绍一下如何用启用。 我这里主要是用命令启用&#xff0c;因为windows 10的最新版本的系统&#xff0c;属性很不不友好了&#xff0c;所以我这里全部用命令操作。图形操作的有空再说。 这个功能是一个服务&…