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. MySql自动备份shell

    MySql黑屏备份是每个运维工程师必备的技能,以下是MySQL自动备份脚本: #/bin/bash#This is mysql backup shell on 2019/4/28 BAKUP_DIR= ...

  2. Codeforces 1108F MST Unification(最小生成树性质)

    题目链接:MST Unification 题意:给定一张连通的无向带权图.存在给边权加一的操作,求最少操作数,使得最小生成树唯一. 题解:最小生成树在算法导论中有这个性质: 把一个连通无向图的生成树边 ...

  3. localhost 和 127.0.0.1 认识

    概念和工作原理 1.概念: localhost:也叫local ,正确的解释是:本地服务器 127.0.0.1:在windows等系统的正确解释是:本机地址(本机服务器) 2.工作原理 localho ...

  4. python之文件的读写和文件目录以及文件夹的操作实现代码

    这篇文章主要介绍了python之文件的读写和文件目录以及文件夹的操作实现代码,需要的朋友可以参考下 为了安全起见,最好还是给打开的文件对象指定一个名字,这样在完成操作之后可以迅速关闭文件,防止一些无用 ...

  5. 如何安装多个mysql 或者如何更改mysql服务名

    此教程适合免安装版本(压缩包)的mysql: 有的时候你需要一台计算机上安装不同的mysql版本,而不同版本的mysql服务名称都是mysql,安装时会有冲突 解决的办法就是安装的时候更改名字 在命令 ...

  6. 快速掌握Nginx(一) —— 安装Nginx和简单配置虚拟主机

    Nginx安装和简单配置虚拟主机 1 Nginx简介 Nginx是近几年最火热的http.反向代理服务器,百度阿里等互联网公司也都在使用Nginx,它也可以用作邮件代理服务器.TCP/UDP代理服务器 ...

  7. mysql删除多个重复数据,多个字段添加唯一性索引

    需求:删除station_id.ab_data_time.item_code_id.data_cycle.ab_value 字段重复的记录 #查询重复的数据 select b.id,b.station ...

  8. (二)初探Maven之设置代理和阿里云镜像

    引言:           在许多公司,可能因为安全性的要求配置了代理服务器,用户无法直接访问外网,所以在项目中使用Maven必须设置好代理才能下载依赖.           并且直接从中央仓库下载依 ...

  9. C#代码使用Process类调用SWFTools工具

    一.Process类调用SWFTools工具将PDF文档转为swf文档 1 string cmdStr = "D:\\SWFTools\\pdf2swf.exe"; string ...

  10. python excel写入及追加写入

    # -*- coding:utf-8 _*- """ @author:Administrator @file: excel.py Description :如果行数是10 ...