计算属性
通过计算得来的属性
computed:是一个计算属性，用来监听属性的变化
computed里面的方法调用的时候是不需要加() 另外里面的方法必须要有一个返回值
 
computed里面的方法不是通过事件来去触发的，
而是当属性(必须是data中的属性)发生了改变的时候那么当前函数就会被触发
computed最大的特点是当属性如果没有发生改变的时候，当前方法的值会从缓存中读取
watch 监听
watch：
用来监听每一个属性的变化
watch这个对象里面都是函数,函数的名称是data中的属性名称,watch中的函数是不需要调用的
当属性发生改变那么就会触发watch中的函数,每一个函数都会接受到2个值 一个值是新值 另外一个值想旧值
 
我们可以在watch当中进行新旧值的判断来减少虚拟DOM的渲染
 
只要当前是属性发生改变就会触发它所对应的函数
 
如果我们需要对对象进行监听的时候需要将属性设置为key值 val值为一个对象
对象中有2个参数是必填 一个是handler函数 一个是deep为true 这样才能实现深度监听
区别
computed与watch的区别？
1、computed在调用的时候不需要加() , watch是不需要调用的
2、computed如果属性没有发生改变的时候会从缓存中读取值 ， watch当属性发生改变的
时候会接受到2个值 一个为新值 一个为旧值
3、computed里面的函数必须要有一个return的结果
4、watch如果需要监听对象的情况下必须设置深度监听
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. BURG For Ubuntu 14.04 Trusty

    sudo add-apt-repository ppa:n-muench/burg sudo apt-get updatesudo apt-get install burg burg-themes D ...

  2. FastJson bean序列化属性顺序问题

    fastjson序列化一个java bean,默认是根据fieldName的字母序进行序列化的,你可以通过ordinal指定字段的顺序,这个特性需要1.1.42以上版本.示例如下. import co ...

  3. 迷你MVVM框架 avalonjs 学习教程3、绑定属性与扫描机制

    在MVVM框架中,你都会看到页面定了许多奇怪的属性,比如knockout的data-☆,angular的ng-☆,avalon的ms-☆,此外还有一些只写文本节点上的双花括号,它们统称为指令.ms-☆ ...

  4. Graphics.BlitMultiTap解析

    [Graphics.BlitMultiTap解析] 上述代码的四个偏移,表示利用此4个偏移,生成4张纹理单位.下面每一个SetTexture,默认会调用一个纹理单位. 而在Shader中,Unity会 ...

  5. Docker构建redis cluster集群

    准备工作 安装gcc ruby 解压编译redis Redis 是 c 语言开发的.安装 redis 需要 c 语言的编译环境.如果没有 gcc 需要在线安装. yum install gcc-c++ ...

  6. 使用SQL查询所有数据库名和表名

    使用SQL查询所有数据库名和表名 MySQL中查询所有数据库名和表名 查询所有数据库 show databases; 1 1 查询指定数据库中所有表名 select table_name from i ...

  7. 磁盘512n,512e,4k原生磁盘的区别和操作系统支持

    磁盘按照物理扇区大小的不同分为三种512byte原生扇区硬盘(512n),4KB扇区仿真512byte(512E)磁盘,4kB扇区原生磁盘. 首先说物理扇区,扇区是硬盘上最小的读写单位,这个是硬盘决定 ...

  8. 使用vim鼠标右键无法粘贴问题解决

    问题: Debian中通过终端使用vim,无法通过鼠标粘贴.这是由于一项默认的鼠标配置导致. 解决方法: vi /usr/share/vim/vim80/defaults.vim 查找set mous ...

  9. sublime填坑之旅: 格式代码， 缩进缩进

    前言:sublime是一款编程神器,轻巧又强大,适用于各种语言.这里介绍下如何快速缩进混乱代码,方便代码阅读. 原料:sublime text 3 1 混乱代码如下: 2  格式菜单选择: 英文: 菜 ...

  10. BZOJ 4326 NOIP2015 运输计划 (二分+树上差分)

    4326: NOIP2015 运输计划 Time Limit: 30 Sec  Memory Limit: 128 MBSubmit: 1930  Solved: 1231[Submit][Statu ...