vue -- 自定义指令钩子函数补充 自定义过滤器filter参数
创始人
2024-06-01 02:17:00
0

自定义指令补充

  • 自定义指令通过钩子函数的形式来实现自定义的功能

这里是几个常用的钩子函数以及它的方法:
bind:只调用一次,指令第一次绑定到元素时调用,在这里可以进行一次性的初始化设置。
inserted:被绑定元素插入父节点时调用
update:所在的组件的VNode更新时调用,指令的值可能发生了改变,也可能没有。
componentUpated:指令所在组件的VNode及其子VNode 全部更新后调用
unbind:只调用一次,指令与元素解绑时调用。

自定义过滤器

过滤器用来对Vue中的属性或者数据进行过滤,即在显示之前进行数据处理或筛选。
过滤器可以用在两个地方:双花括号差值和v-bind表达式

过滤器的语法如下:

{{data|filter(参数)}}

data时filter的第一个参数(隐性参数),而括号中的参数是指第二个以后的参数。

过滤器的用法如下:

//双花括号形式
{{message|capitalize}}
//v-bind形式
  • 为什么叫自定义过滤器?

因为Vue2.0以后删除了所有内置过滤器

自定义全局过滤器

使用全局方法Vue.filter可自定义全局过滤器。所谓全局方法就是在多个实例中都可以使用。比如,再定义一个vue实例,在这个示例挂载的元素中也可以使用。

对于过滤器执行的函数,一般建议用箭头函数来表示。


{{8|addZero}}

1

注意:过滤器要先定义,然后再new Vue()实例,否则会失效且报错(也就是过滤器要写在new Vue()前面)

自定义局部过滤器

局部过滤器就是写在实例内部,通过filter选项设置,只能应用在对应的Vue实例挂载的DOM上。


{{currentDate|filterNum(3)}}

1

在这里插入图片描述

相关内容

热门资讯

监控摄像头接入GB28181平... 流程简介将监控摄像头的视频在网站和APP中直播,要解决的几个问题是:1&...
Windows10添加群晖磁盘... 在使用群晖NAS时,我们需要通过本地映射的方式把NAS映射成本地的一块磁盘使用。 通过...
protocol buffer... 目录 目录 什么是protocol buffer 1.protobuf 1.1安装  1.2使用...
在Word、WPS中插入AxM... 引言 我最近需要写一些文章,在排版时发现AxMath插入的公式竟然会导致行间距异常&#...
【PdgCntEditor】解... 一、问题背景 大部分的图书对应的PDF,目录中的页码并非PDF中直接索引的页码...
修复 爱普生 EPSON L4... L4151 L4153 L4156 L4158 L4163 L4165 L4166 L4168 L4...
Fluent中创建监测点 1 概述某些仿真问题,需要创建监测点,用于获取空间定点的数据࿰...
educoder数据结构与算法...                                                   ...
MySQL下载和安装(Wind... 前言:刚换了一台电脑,里面所有东西都需要重新配置,习惯了所...
MFC文件操作  MFC提供了一个文件操作的基类CFile,这个类提供了一个没有缓存的二进制格式的磁盘...