1.computed(计算属性)
computed是计算属性,事实上和和data对象里的数据属性是同一类的(使用上),

2.methods(方法)
写在html中的时候需要带()支持传参,且需要有触发条件(@)。
methods里面是用来定义函数的,很显然,它需要手动调用才能执行。而不像watch和computed那样,“自动执行”预先定义的函数。
methods里面定义的是函数,你显然需要像"fuc()"这样去调用它(假设函数为fuc)。
methods不处理数据逻辑关系,只提供可调用的函数。

3.watch
类似于监听机制+事件机制。

4.watch/computed
当某一个数据(称它为依赖数据)发生变化的时候,所有依赖这个数据的“相关”数据“自动”发生变化,也就是自动调用相关的函数去实现数据的变动。
都是希望在依赖数据发生改变的时候,被依赖的数据根据预先定义好的函数,发生“自动”的变化。
watch擅长处理的场景:一个数据影响多个数据。
computed擅长处理的场景:一个数据受多个数据影响。
methods里面的函数就是一群“耿直Boy”,如果有其他父函数调用它,它会每一次都“乖乖”地执行并返回结果,即使这些结果很可能是相同的,是不需要的。
而computed是一个“心机Boy”,它会以Vue提供的依赖追踪系统为基础,只要依赖数据没有发生变化,computed就不会再度进行计算。

vue computed、methods、watch的区别的更多相关文章

  1. vue中methods、computed、watch区别

    vue中methods.computed.watch区别methods:事件调用的钩子 computed:{ // 计算属性是根据他依赖的值计算的,当依赖值发生变化,其跟着改变 // 计算属性是依赖缓 ...

  2. 【Vue】----- computed与watch的区别

    1.computed computed是一种计算属性,用来监听属性的变化: computed里面的方法调用的时候不需要加(),并且里面的方法必须要有一个返回值: computed里面的方法不是通过事件 ...

  3. vue中computed/method/watch的区别

    摘要:本文通过官方文档结合源码来分析computed/method/watch的区别. Tips:本文分析的源码版本是v2.6.11,文章中牵涉到vue响应式系统原理部分,如果不是很了解,建议先阅读上 ...

  4. vue中methods,computed,filters,watch的总结

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

  5. computed 与methods , watched 的区别

    computed 与watched 的区别: 异步请求 数据变化 使用watched ,计算属性不支持异步 计算一个值的结果 用 computed computed 与methods的区别: comp ...

  6. vue computed和methods 计算属性和侦听器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. vue computed 原理

    vue computed 主要依靠数据依赖来更新,这里不展示computed源代码,只展示核心思想. computed: { a(){ return this.b ++ } } data:{ b: 1 ...

  8. about use Vue of methods

    methods 处理事件 methods 在vue中处理一些逻辑方面的事情.vue事件监听的方式看上去有点违背分离的传统观念.而实际上vue中所有事件的处理方式和表达式都是严格绑定在当前的视图的vie ...

  9. vue & lifecycle methods & this bug & ES6 Arrow function & this bind bug

    vue & lifecycle methods & this bug ES6 Arrow function & this bind bug bad fetchTableData ...

  10. vue中methods中的方法闭包缓存问题

    vue中methods中的方法闭包缓存问题 问题背景 需求描述 在路由的导航栏中需要, 判断是否为第一次点击 需要一个标志位来记录是否点击过 现状: 这个标志位只在一个函数中用过.不希望存放全局 希望 ...

随机推荐

  1. 如何规避“Flash中国特供版”

    如何规避“Flash中国特供版” 来源  http://blog.sina.com.cn/s/blog_4e1bc3e90102xn0k.html 浏览国内网站,尤其是一些很重要或者很常用,但是很落后 ...

  2. 「洛谷5300」「GXOI/GZOI2019」与或和【单调栈+二进制转化】

    题目链接 [洛谷传送门] 题解 按位处理. 把每一位对应的图都处理出来 然后单调栈处理一下就好了. \(and\)操作处理全\(1\). \(or\)操作处理全\(0\). 代码 #include & ...

  3. python并发编程之多线程基础知识点

    1.线程理论知识 概念:指的是一条流水线的工作过程的总称,是一个抽象的概念,是CPU基本执行单位. 进程和线程之间的区别: 1. 进程仅仅是一个资源单位,其中包含程序运行所需的资源,而线程就相当于车间 ...

  4. did not finish being created even after we waited 189 seconds or 61 attempts. And its status is downloading

    did not finish being created even after we waited 189 seconds or 61 attempts. And its status is down ...

  5. 并查集(我根本不会切板子啊喂QWQ长文)(大雾

    说句实话,我和并查集的缘分还是蛮深的,因为当年学完数论想着找板子题乱做(真是个神奇的找题方式呢),然后就看到了并查集QWQ,看了一会发现是图论就不看了,,,,,,结果还被说是大佬QWQ其实我只是个Na ...

  6. Django mysql应用

    环境:python3.Django2 1.安装驱动mysqlclient pip3 install mysqlclient 2.创建一个数据库 CREATE DATABASE database_nam ...

  7. ansible Templates

    Files和templates files和templates均用于ansible文件处理,两者的主要区别是:Files目录下的文件无需写绝对路径即可将文件传输到远程主机,templates目录下文件 ...

  8. ArcGis Classic COM Add-Ins插件dll的安装与卸载

    本文是去年<ArcGis Classic COM Add-Ins插件开发的一般流程 C#>一文(以下称“开发流程”)的后续.“开发流程”中写到会有“安装与卸载”系列的文章,今天把它补上. ...

  9. kali linux工具--信息批量收集工具theharvester

    在渗透测试早期阶段,安全人员往往需要从互联网快速获取目标的一些信息,以确认测试目标的概况.为了满足这个需求,Kali Linux提供了theharvester工具.该工具可以搜索引擎.社交网站获取目标 ...

  10. docker学习------记录centos7.5下docker安装更换国内源的处理过程

    一.centos7.5下更换阿里源 1.装好centos7.5镜像,将yum源更换为阿里源 第一步:刚出的centos7.5是解析不到阿里的东西的,所以找了台centos7.4,下载一些包 (1) 下 ...