Vue 中watch和computed 的用法及区别

计算属性
        通过计算得来的属性

        computed:是一个计算属性，用来监听属性的变化

        computed里面的方法调用的时候是不需要加() 另外里面的方法必须要有一个返回值

computed里面的方法不是通过事件来去触发的，
        而是当属性(必须是data中的属性)发生了改变的时候那么当前函数就会被触发

        computed最大的特点是当属性如果没有发生改变的时候，当前方法的值会从缓存中读取

例如：

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中属性的名称

转载于:https://www.cnblogs.com/zhouyingying/p/10560312.html

Vue 中watch和computed 的用法及区别相关推荐

Vue中watch、computed、updated的区别
watch watch:侦听器,监听某个数据的变化然后执行相对应的方法,来响应数据的变化,尤其是当需要数据变化时执行异步操作或着开销较大时,这个方式是最有用的 <div id="wat ...
vue中父子组件及 watch用法
父子组件及 watch vue中父子组件及 watch用法 - coder_zhang123456 - 博客园
@ini_get php,php中get_cfg_var()和ini_get()的用法及区别_php技巧_脚本之家
本文实例讲述了php中get_cfg_var()和ini_get()的用法及区别.分享给大家供大家参考.具体分析如下: php里get_cfg_var()和ini_get()都是取得配置值的函数,当你 ...
【Java学习笔记之二十九】Java中的equals和==的用法及区别
Java中的"equals"和"=="的用法及区别在初学Java时,可能会经常碰到下面的代码: 1 String str1 = new String(&quo ...
php在类定义一个我静态变量,php中静态类与静态变量用法的区别分析_PHP教程
php中静态类与静态变量用法的区别分析 static是定义一个静态对象或静态变量,关于static 定义的变量或类方法有什么特性我们看完本文章的相关实例后就见分晓了. 1. 创建对象$object = ...
Python学习笔记（一）1.Python中end=和sep=的用法与区别。
一.Python中end=和sep=的用法与区别: python中常用到的end=和sep=两种参数用法相似,一个是python输出结尾,一个是python输出分割. end: 默认是换行,表示两个字 ...
关于Vue中计算属性computed和methods属性的区别，你了解多少呢
文章目录 1.实例 2.computed计算属性中: 前提1.当计算属性fn2没有依赖data中的数据时: 前提2.:当计算属性依赖data中的数据时: 3.区别: 在做项目过程中,有时会出现同一个需 ...
实现 VUE 中 MVVM - step10 - Computed
看这篇之前,如果没有看过之前的文章,移步查看: 实现 VUE 中 MVVM - step1 - defineProperty 实现 VUE 中 MVVM - step2 - Dep 实现 VUE 中 ...
关于vue中watch和computed
computed:计算属性通过属性计算的来的属性 1.computed里面的函数建议有返回值,不建议去修改data中的属性 2.在使用computed中的方法时,是不需要加() 3.compu ...
Vue中watch、computed、updated三者的区别以及使用方法
1.watch 理解: 监听器,监听某个数据的变化从而来执行一些操作,当data里面的数据发生变化的时候来执行一下开销较大或异步的操作 1.监听值类型(简单类型)数据 //在一个vue实例中new V ...

Vue 中watch和computed 的用法及区别

Vue 中watch和computed 的用法及区别相关推荐

最新文章

热门文章