今日学习内容
全局过滤器和局部过滤器
全局过滤器:在任何一个Vue实例控制的区域中都可以使用
局部过滤器:只能在自定义的那个Vue实例中使用
出现位置:双花括号插值和 v-bind 表达式
Vue.filter("过滤器名称", 过滤器处理函数):(没有s)
过滤器使用:{{msg| 过滤器名称}}:value="msg | 过滤器名称"
何自定义局部过滤器:和data平级 filters:{}
如果全局过滤器和局部过滤器同名,按照就近原则,调用局部过滤
总结:Vue.js允许自定义过滤器,可被用于一些常见的文本格式化。
过滤器可以用在两个地方:双花括号插值和v-bind表达式。
过滤器应该被添加在JavaScript表达式的尾部,由“管道”符号指示 |支持级联操作过滤器不改变真正的 data ,而只是改变渲染的结果,并返回过滤后的版本
计算属性 computed
computed 选项定义计算属性计算属性类似于 methods 选项中定义的函数 (双向绑定),计算属性:会进行缓存,只有依赖数据发生改变,才会重新进行计算
计算属性的应用场景:
由于计算属性会将返回的结果缓存起来所以如果返回的数据不经常发生变化,那么使用计算属性的性能会比使用函数的性能高
监听器 watch
使用watch来响应数据data的变化,触发对应回调函数,要监视的数据名就是回调函数名
computed:支持缓存,只有依赖数据发生改变,才会重新进行计算watch:不支持缓存,数据变,直接会触发相应的操作。数据经常变化用watch,不经常变化用computed。
使用场景:watch擅长处理的场景:一个数据影响多个数据
computed擅长处理的场景:一个数据受多个数据影响
|