计算属性 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. JavaEE高级-MyBatis学习笔记

    一.MyBatis简介 - MyBatis 是支持定制化 SQL.存储过程以及高级映射的优秀的持久层框架. - MyBatis 避免了几乎所有的 JDBC 代码和手动设置参数以及获取结果集. - My ...

  2. Windows 实用软件

    Useful tool Listary Ditto Winsnap Quick Look Myper Splash GifCam ScreenToGif Free Download Manage Si ...

  3. Comet OJ - Contest #0 A题 解方程 （数学）

    题目描述 小象同学在初等教育时期遇到了一个复杂的数学题,题目是这样的: 给定自然数 nn,确定关于 x, y, zx,y,z 的不定方程 \displaystyle \sqrt{x - \sqrt{n ...

  4. GUI学习之三十—QCalendarWidget学习总结

    今天学习的是最后一个展示控件——QCalendarWidget 一.描述 QCalendarWidget提供了一个基于每月的日历控件,允许用户选择一个日期,还可以看一下里面的图示: QCalendar ...

  5. 开发板安装google浏览器

    source.list中含有https 所以在更换源之前安装 apt-get install apt-transport-https 然后更换为中科大的源貌似不行 deb https://mirror ...

  6. seleniummaster

    http://seleniummaster.com/sitecontent/index.php/component/banners/click/6 Step 1: create a Java proj ...

  7. frps启动

    1.找到frps.ini文件 find  / -name 'frps.ini' 2.窗口启动 ./frps -c ./frps.ini 3.关闭窗口,后台运行 setsid  ./frps -c ./ ...

  8. Java的基本使用

    1.如何运行一个Java源码 打开文本编辑器,输入以下代码: public class Hello { public static void main(String[] args) { System. ...

  9. 【rust】rust安装，运行第一个Rust 程序 （1）

    安装 Rust 在 Unix 类系统如 Linux 和 macOS 上,打开终端并输入: curl https://sh.rustup.rs -sSf | sh 回车后安装过程出现如下显示: info ...

  10. c++复习——类（1）

    1.  拷贝构造函数 //并没有搞懂 先存着吧  遇到实际情况再回来看看 拷贝构造函数在以下三种情况被调用: (1)当用一个已经初始化过的对象去初始化同类另一个对象时, 拷贝构造函数被调用. Samp ...