计算属性 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的更多相关文章

  1. Vue 中的 computed 和 methods

    Vue 中的 computed 和 methods 使用 computed 性能会更好. 如果你不希望缓存,可以使用 methods 属性.

  2. vue中methods,computed，filters,watch的总结

    08.28自我总结 vue中methods,computed,filters,watch的总结 一.methods methods属性里面的方法会在数据发生变化的时候你,只要引用了此里面分方法,方法就 ...

  3. vue系列---理解Vue中的computed,watch,methods的区别及源码实现(六)

    _ 阅读目录 一. 理解Vue中的computed用法 二:computed 和 methods的区别? 三:Vue中的watch的用法 四:computed的基本原理及源码实现 回到顶部 一. 理解 ...

  4. 详解Vue中的computed和watch

    作者:小土豆 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.cn/user/2436173500265335 1. 前言 作为一名Vue ...

  5. 浅尝 Vue 中的 computed 属性 与 watch

    对于 computed 的理解: ①.computed 用来监控自己定义的变量,该变量不在 data 里面声明,直接在 computed里面定义,然后就可以在页面上进行双向数据绑定展示出结果或者用作其 ...

  6. Vue中的computed属性

    阅读Vue官网的过程中,对于计算属于与监听器章节的内容有点理解的不清晰:https://cn.vuejs.org/v2/guide/computed.html. 后来上网查询了资料,结合官网的说明,总 ...

  7. 八、Vue中的computed属性

    看了网上很多资料,对vue的computed讲解自己看的都不是很清晰,今天忙里抽闲,和同事们又闲聊起来,对computed这个属性才有了一个稍微比较清晰的认识,下面的文章有一部分是转自: https: ...

  8. 十三、Vue中的computed属性

    以下抄自https://www.cnblogs.com/gunelark/p/8492468.html 看了网上很多资料,对vue的computed讲解自己看的都不是很清晰,今天忙里抽闲,和同事们又闲 ...

  9. Vue中的computed和watch

    看了网上很多资料,对vue的computed讲解自己看的都不是很清晰,今天忙里抽闲,和同事们又闲聊起来,对computed这个属性才有了一个稍微比较清晰的认识,下面的文章有一部分是转自: https: ...

  10. vue中的computed和watch区别

    在vue.js官方文档中看到computed和watch获取全名的一个例子: var var vm = new Vue({ el: '#demo', data: { firstName: 'Foo', ...

随机推荐

  1. .net 正则表达式

    string RegStr = @"^[0-9]*[1-9][0-9]*$"; if (Regex.IsMatch("待验证的字符串", RegStr)) { ...

  2. 一、ASP.NET Iframework_SignalR永久连接类（v2）

    一.新建项目,选MVC项目默认 添加mvc文件夹和核心引用 二.添加SignaIR包 SignalR的准备:NuGet包管理器搜索:工具——>库程序包管理器——>Microsoft.Asp ...

  3. 安装SQL2005数据库服务时报错处理方法

    运行一个脚本,以管理员身份运行: net stop winmgmt c: cd %systemroot%/system32/wbem rd /S /Q repository regsvr32 /s % ...

  4. linux 时区问题

    1.java项目发现 服务器时间不正确,修改了服务器时间之后依然没解决. 2.java虚拟机的时区也需要设置:

  5. Word快捷选取

    在word中,你知道鼠标单击选中一个词,双击选中一行,三击选中一个段落吗?

  6. Flask之 请求，应用 上下文源码解析

    什么是上下文? 每一段程序都有很多外部变量.只有像Add这种简单的函数才是没有外部变量的.一旦你的一段程序有了外部变量,这段程序就不完整,不能独立运行.你为了使他们运行,就要给所有的外部变量一个一个写 ...

  7. 对async/await的研究

    1. 作为一个关键字放到函数前面,用于表示函数是一个异步函数,因为async就是异步的意思, 异步函数也就意味着该函数的执行不会阻塞后面代码的执行. 写一个async 函数 async functio ...

  8. LTM_本地流量管理（二）

    会话保持 首先要熟悉两个概念:连接connect和会话session 连接:在四层负载均衡中,连接是最小元素. l  源端口:客户端随机产生的端口. l  源地址:发起请求的源IP地址. l  目的端 ...

  9. JSP页面与html页面在ie下显示的样式不一致的问题

    今天前端将样式与html给我文件我转化为jsp之后在我的电脑上使用IE11的IE9和其他浏览器都没有问题,但是在发给其他人检查的时候却发现在win7电脑的IE9上出现样式错乱的问题,前端调试无果的情况 ...

  10. js数字每3位加一个逗号

    if(typeof val ==="number"){ var str = val.toString(); ? /(\d)(?=(\d{})+\.)/g : /(\d)(?=(?: ...