vue开发computed,watch,method执行的先后顺序
1#computed:计算属性将被混入到 Vue 实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。
2#methods:methods 将被混入到 Vue 实例中。可以直接通过 VM 实例访问这些方法,或者在指令表达式中使用。方法中的 this 自动绑定为 Vue 实例。
3#watch:是一种更通用的方式来观察和响应 Vue 实例上的数据变动。一个对象,键是需要观察的表达式,值是对应回调函数。值也可以是方法名,或者包含选项的对象。Vue 实例将会在实例化时调用 $watch(),遍历 watch 对象的每一个属性。
通俗来讲,
computed是在HTML DOM加载后马上执行的,如赋值;
而methods则必须要有一定的触发条件才能执行,如点击事件;
watch呢?它用于观察Vue实例上的数据变动。对应一个对象,键是观察表达式,值是对应回调。值也可以是方法名,或者是对象,包含选项。
所以他们的执行顺序为:默认加载的时候先computed再watch,不执行methods;等触发某一事件后,则是:先methods再watch。
下面的例子可以做为说明。
computed 属性 vs watched 属性:Vue 确实提供了一种更通用的方式来观察和响应 Vue 实例上的数据变动:watch 属性。当你有一些数据需要随着其它数据变动而变动时,你很容易滥用 watch——特别是如果你之前使用过 AngularJS。然而,通常更好的想法是使用 computed 属性而不是命令式的 watch 回调。
所以他们的执行顺序为:默认加载的时候先computed再watch,不执行methods;等触发某一事件后,则是:先methods再watch。
---------------------
作者:Generon
来源:CSDN
原文:https://blog.csdn.net/generon/article/details/79752414
版权声明:本文为博主原创文章,转载请附上博文链接!
vue开发computed,watch,method执行的先后顺序的更多相关文章
- Vue中computed与method的区别
转载于:https://segmentfault.com/a/1190000014478664?utm_source=tag-newest 1.computed区别于method的两个核心 在官方文档 ...
- vue的computed和method的区别
(1)computed是响应式的,methods并非响应式. (2)computed是带缓存的 (3)computed中的成员可以只定义一个函数作为只读属性,也可以定义get/set变成可读写属性,这 ...
- [vue] computed 和 method
计算属性 计算属性只有在它的相关依赖发生改变时才会重新取值 Method method每次渲染的时候都会被执行 举一个栗子 <template>...<div> <p& ...
- vue 的 computed 属性在什么时间执行
vue 的 computed 属性在什么时间执行
- vue 开发规范
本文档为前端 vue 开发规范 规范目的 命名规范 结构化规范 注释规范 编码规范 CSS 规范 规范目的 为提高团队协作效率 便于后台人员添加功能及前端后期优化维护 输出高质量的文档 命名规范 为了 ...
- 使用vue开发项目需要注意的问题和可能踩到的坑
最近,在公司给一些刚刚使用vue进行开发的同学做了一次分享, 其中包括一些vue开发中需要注意的点, 以及一些可能会踩到的坑.具体内容如下: 一.生命钩子使用需要注意的地方 1.beforeCreat ...
- 面试官:自己搭建过vue开发环境吗?
开篇 前段时间,看到群里一些小伙伴面试的时候被面试官问到这类题目.平时大家开发vue项目的时候,相信大部分人都是使用 vue-cli脚手架生成的项目架构,然后 npm run install 安装依赖 ...
- Vue开发入门看这篇文章就够了
摘要: 很多值得了解的细节. 原文:Vue开发看这篇文章就够了 作者:Random Fundebug经授权转载,版权归原作者所有. 介绍 Vue 中文网 Vue github Vue.js 是一套构建 ...
- 03 . Gin+Vue开发一个线上外卖应用(用户数据创建,插入,跨域处理)
功能和背景介绍 在项目的登录功能中,如果在登录时发现用户名和密码在用户表中不存在,会自动将用户名和密码保存在用户表中,创建一个新的用户. 因此,除了使用手机号和验证码登录以外,还支持使用用户名.密码进 ...
随机推荐
- 20155321 2016-2017-2 《Java程序设计》第七周学习总结
20155321 2016-2017-2 <Java程序设计>第七周学习总结 教材学习内容总结 Date/DateFormat Date是日期类,可以精确到毫秒. 构造方法 Date() ...
- Python练习-递归二分算法
# 编辑者:闫龙 #递归,二分算法演示 l = [i for i in range(1,100)]#定义一个列表l,并追加1-99的所有数字 def FindNum(num,l):#定义函数FindN ...
- 对string 的操作
相信使用过MFC编程的朋友对CString这个类的印象应该非常深刻吧?的确,MFC中的CString类使用起来真的非常的方便好用.但是如果离开了MFC框架,还有没有这样使用起来非常方便的类呢?答案是肯 ...
- Spiral Matrix I & II
Spiral Matrix I Given an integer n, generate a square matrix filled with elements from 1 to n^2 in s ...
- Git管理本地代码(一)【转】
转自:http://blog.csdn.net/weihan1314/article/details/8677800 版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[+] 安 ...
- numpy细碎知识点
np.random.rand() 基于python自带模块random的random函数的一个延伸吧,生成指定数量的列表 np.random.rand(a,b) 参数a,b均为整型,生成含有a个元素的 ...
- mvc4 @foreach 如何写@if 判断
不知道你想写在里面还是外面,我里外都写上,你可以参考下:@if(Model!=null){ foreach(var item in Model) { if(item.Name=="李四&qu ...
- Oracle11g用户、权限、角色、概要文件管理及审计
第10章 安全管理 1 用户管理 2 权限管理 3 角色管理 : 4 概要文件管理 5 审计 操作系统:win7 Oracle安装目录:E盘 数据库名字:orcl 密码:123456 先 ...
- linux系统时钟和硬件时钟不一致
在做DB2 集群复制的时候要求两台主机时间相互一致. 但是在一台主机上系统时间和硬件时间相差12个小时左右:手动同步后,重启后又相差12个小时左右. 为什么会是这样的,先介绍下系统时钟和硬件时钟的区别 ...
- 20165203《Java程序设计》第二周Java学习总结
教材学习内容总结 第二章 (一)标识符 注意: 标识符由字母.下画线.美元符号和数字组成,长度不受限制. 标识符第一个字符不能是数学字符. 标识符不能是关键字. 标识符不能是true.false和nu ...