vue中的computed 与 watch
计算属性 computed
指通过计算得来的属性,用于监听属性的变化
computed里面的函数调用的时候 不需要加()
方法里必须有一个返回值 return
computed中的函数不会通过事件去触发的,而是当属性(必须是data中的属性)发生改变的时候,computed里面的函数就自然而然的去触发
computed最大的特点就是 当属性状态未发生改变的时候。当前的函数会从缓存中读取
监听属性 watch
用于监听每一个属性的变化
watch这个对象里面都是函数,函数的名称一定是 data中属性的名称 。 watch中函数是不需要调用的
我们可以在watch中进行新旧值的判断 从而来减少虚拟DOM的渲染
只要当前属性发生改变就会触发 与之对应的函数
若我们需要对对象进行监听 , 需要将属性设置为 key 值 , val 为一个对象 且对象中有两个参数必写 , 一个数handle函数, 一个为 deep = true 从而实现深度监听
computed 与 watch 区别
1 computed中的函数调用是不需要()的 , 而watch是不需要进行函数调用的
2. 当属性没有发生改变的时候 ,computed中的函数会从 缓存 中读取值 当属性发生改变的时候,watch中的函数会接受两个参数,一个代表 新值,另一个代表旧值
3. watch 若需要监听对象,必须使用 深度监听
4. computed 中的函数必须要带有返回值 return
5. 命名: computed 中的函数命名是任意的 , watch中的函数名必须是 data 中参数的名
vue中的computed 与 watch的更多相关文章
- Vue 中的 computed 和 methods
Vue 中的 computed 和 methods 使用 computed 性能会更好. 如果你不希望缓存,可以使用 methods 属性.
- vue中methods,computed,filters,watch的总结
08.28自我总结 vue中methods,computed,filters,watch的总结 一.methods methods属性里面的方法会在数据发生变化的时候你,只要引用了此里面分方法,方法就 ...
- vue系列---理解Vue中的computed,watch,methods的区别及源码实现(六)
_ 阅读目录 一. 理解Vue中的computed用法 二:computed 和 methods的区别? 三:Vue中的watch的用法 四:computed的基本原理及源码实现 回到顶部 一. 理解 ...
- 详解Vue中的computed和watch
作者:小土豆 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.cn/user/2436173500265335 1. 前言 作为一名Vue ...
- 浅尝 Vue 中的 computed 属性 与 watch
对于 computed 的理解: ①.computed 用来监控自己定义的变量,该变量不在 data 里面声明,直接在 computed里面定义,然后就可以在页面上进行双向数据绑定展示出结果或者用作其 ...
- Vue中的computed属性
阅读Vue官网的过程中,对于计算属于与监听器章节的内容有点理解的不清晰:https://cn.vuejs.org/v2/guide/computed.html. 后来上网查询了资料,结合官网的说明,总 ...
- 八、Vue中的computed属性
看了网上很多资料,对vue的computed讲解自己看的都不是很清晰,今天忙里抽闲,和同事们又闲聊起来,对computed这个属性才有了一个稍微比较清晰的认识,下面的文章有一部分是转自: https: ...
- 十三、Vue中的computed属性
以下抄自https://www.cnblogs.com/gunelark/p/8492468.html 看了网上很多资料,对vue的computed讲解自己看的都不是很清晰,今天忙里抽闲,和同事们又闲 ...
- Vue中的computed和watch
看了网上很多资料,对vue的computed讲解自己看的都不是很清晰,今天忙里抽闲,和同事们又闲聊起来,对computed这个属性才有了一个稍微比较清晰的认识,下面的文章有一部分是转自: https: ...
- vue中的computed和watch区别
在vue.js官方文档中看到computed和watch获取全名的一个例子: var var vm = new Vue({ el: '#demo', data: { firstName: 'Foo', ...
随机推荐
- Linux学习--第一天--Unix 、 Linux 发展史,Linux应用领域
UNIX发展史 肯·汤姆森开发出linux. 肯·汤姆森的同事丹尼斯·里奇在1971年开发了C语言. 操作系统 公司 硬件平台 AIX IBM PowerPC HP-UX HP PA-RISC Sol ...
- Verilog-2001标准在2001年就发布了
,不过翻了一些Verilog书籍,对Verilog-2001的新增特性很少有提及,即使提到了,也只是寥寥数语带过,其实在Verilog-2001中做了很多有用的改进,给编程带来很大的帮助,有必要详 ...
- index 索引
1.创建表 drop table if exists kg_fk_user;create table kg_fk_user(id int,name string)row format delimite ...
- Vscode添加谷歌Debug插件
1. 2.安装好 Debugger for Chrome之后,找到要进行Debug的文件 3. 4.进入到launch.json文件中进行相应的配置 配置文件内容如下: { "version ...
- Django【第22篇】:基于Ajax实现的登录
基于ajax实现的登录 一.需要知道的新知识点 1.刷新验证码.给src属性加一个?号.加个?会重新去请求 //#给验证码刷新 $(".vialdCode_img").click( ...
- java:投个票程序
投票城市用到了:system.in, 正则pattern,matcher,排序接口comparable 复写compareTo排序方法 一个班级在选班长,按序号进行投票,并将票数最高的放在第一位显示 ...
- kafka完全分布式搭建(2.12版)
1.下载解压 tar -xvf kafka_2.12-1.0.0.tgz 2.进入config目录下,修改server.propeties文件 broker.id=0 #当前server编号 port ...
- linux运维、架构之路-CentOS6.9安装Zabbix3.4.1
一.LAMP环境安装 1.环境 [root@m01 ~]# cat /etc/redhat-release CentOS release 6.9 (Final) [root@m01 ~]# uname ...
- 面试题常考&必考之--js数组排序冒泡排序和快速排序
冒泡排序: 原理:比较相邻的元素,将值大的元素交换到右边.(如果相等不进行交换) 实例: 要排列数组:[10,1,35,61,89,36,55] 第一趟排序: 第1次排序:10和1比较,10>1 ...
- Java——super
在Java类中使用super来引用基类的成分. [代码]