博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
[转] vue之computed和watch
阅读量:5867 次
发布时间:2019-06-19

本文共 907 字,大约阅读时间需要 3 分钟。

计算属性 computed
侦听器or观察者 watch

一直以来对computed和watch一知半解,用的时候就迷迷糊糊的,今天仔细看了看文档,突然茅塞顿开,原来就是这么简单啊:

computed,通过别人改变自己

watch,通过自己改变别人

需要注意的是,computed会缓存数据,只有在满足以下两个条件时才会重新计算:

1、存在依赖型数据,即存在于VUE的data等对象的实下的实例数据

2、依赖型数据发生改变

如果不满足以上两个条件,computed不会重新计算,只会拿缓存的数据。而watch,只要调用他,他就会执行。

注意:computed会缓存数据,所以进行开销较大的操作时不适合用它。

非依赖型数据发生改变时,这是使用methods方法即可。

computed也可以通过自己改变别人

computed默认只有 getter ,不过在需要时也可以提供一个 setter:

computed: {      fullName: {        // getter        get: function () { return this.firstName + ' ' + this.lastName }, // setter set: function (newValue) { var names = newValue.split(' ') this.firstName = names[0] this.lastName = names[names.length - 1] } } }

然后运行 vm.fullName = 'John Doe' 时,setter 会被调用,vm.firstName 和 vm.lastName 也会相应地被更新。

什么时候使用

computed

1、其他依赖型数据发生改变,自身也要改变的时候

2、自身改变了,想要改变其他数据的时候,这时需要添加setter

watch

1、自身改变时改变其他数据

2、当需要在数据变化时执行异步或开销较大的操作时

转载于:https://www.cnblogs.com/chris-oil/p/9962188.html

你可能感兴趣的文章
H5网页涂鸦canvas
查看>>
Python基础1—搭建环境
查看>>
(转)android UI进阶之实现listview的下拉加载
查看>>
php 获取今日、昨日、上周、本月的起始时间戳和结束时间戳的方法(转)
查看>>
mysql出现Got error 28 from storage engine错误
查看>>
elasticsearch-head 安装
查看>>
Hyperledger Fabric 1.1 -- Policy 构成
查看>>
leetcode-506-Relative Ranks
查看>>
Comm100 Email Marketing API学习小结
查看>>
在word中选择一个矩形区域
查看>>
Linux命令:查看文件内容cat|tac|more|less|head|tail|nl|od
查看>>
****** 三十八 ******、软设笔记【网络基础】-网络设备
查看>>
C++实现线性表的顺序存储结构
查看>>
2016年中总结
查看>>
UVa 378 - Intersecting Lines
查看>>
1.Tomcat组件梳理—Bootstrap启动器
查看>>
cas 认证管理器
查看>>
Map类
查看>>
Eclipse中将Java项目转换成Web项目的方法
查看>>
Django 框架之 Models
查看>>