Vue -- watch用法

watch的作用可以监控一个值的变换，并调用因为变化需要执行的方法。可以通过watch动态改变关联的状态。

vue watch用法

data:{a:1,b:{c:1}},watch:{a(val, oldVal){                         //普通的watch监听console.log("a: "+val, oldVal);},b:{                                     //深度监听，可监听到对象、数组的变化handler(val, oldVal){console.log("b.c: "+val.c, oldVal.c);//但是这两个值打印出来却都是一样的},deep:true}}

watch 是一个对象，对象就有键，有值。

值可以是函数：就是当你监控的家伙变化时，需要执行的函数，这个函数有两个形参，第一个是变化后的值，第二个是变化前的值。

值也可以是函数名：不过这个函数名要用单引号来包裹。

值是包括选项的对象：选项包括有三个。

第一个handler：其值是一个回调函数。即监听到变化时应该执行的函数。

第二个是deep：其值是true或false；确认是否深入监听。deep的意思就是深入观察，监听器会一层层的往下遍历，给对象的所有属性都加上这个监听器（受现代 JavaScript 的限制 (以及废弃 Object.observe)，Vue 不能检测到对象属性的添加或删除）

第三个是immediate：其值是true或false；immediate:true代表如果在 wacth 里声明了之后，就会立即先去执行里面的handler方法，如果为 false就跟我们以前的效果一样，不会在绑定的时候就执行

Vue -- watch用法相关推荐

Vue第二天学习总结—— Vue全家桶之组件化开发(组件化开发思想、组件注册、Vue调试工具用法、组件间数据交互传递、组件插槽、基于组件的案例——购物车)
(一) 组件化开发思想 1. 现实中的组件化思想体现组件化即是对某些可以进行复用的功能进行封装的标准化工作标准:要想组件能够成功组合在一起,每个组件必须要有标准分治:将不同的功能封装到不同的组件 ...
vue+filter+html标签,vue过滤器用法实例分析
本文实例讲述了vue过滤器用法.分享给大家供大家参考,具体如下: 过滤器: vue提供过滤器: capitalize uppercase currency.... {{msg|currency ￥}} ...
vue foreach用法_两年前端er，JS和Vue，面试被问了哪些问题呢？有点简单啊
上午跟一个大学学妹聊天,聊起了她近期的一次面试. 她的概况,工作两年不到,薪资要求在8-10K之间,技术栈Vue,想在大一点的团队工作,因为之前都是一个人做前端. 以下是问及的一些问题(我做了一些简单 ...
vue foreach用法_vue 源码探究（第二弹）
vue 源码探究(第二弹) 接着上一篇,继续来讲一个非常有意思的东西documentFragment 解析六.DocumentFragment: 文档碎片(高效批量更新多个节点) 这里先甩出 2 个 ...
VUE基础用法（四）
一.VUE中组件化思想 1.分布式思想 1.1)传统项目设计思想说明: 单体项目架构设计,在同一个tomcat服务器中,如果一个模块出现问题,则直接影响整个tomcat服务器运行,项目架构设计耦合性 ...
vue watch用法
vue watch 有三种用法直接写一个监听处理函数,当每次监听到路由发生变化时,执行函数监听对象:{handler(){},immediate:false, deep:false} 子组件pr ...
Vue watch 用法
watch 的用法: 在Vue 框架中: data 中保存有数据. 但是在watch 监听器中可以监听data 中的数据, 也可以监听prop 中的数据.在watch 监听器中监听data 中的数据, ...
SSR——服务器端渲染(Vue)基础用法(一)
学习来源 1.简介服务器端渲染:Vue.js 是构建客户端应用程序的框架.默认情况下,可以在浏览器中输出 Vue 组件,进行生成 DOM 和操作 DOM.然而,也可以将同一个组件渲染为服务器端的 H ...
Vue基本用法-指令（二）
1.3 事件绑定指令 vue 提供了 v-on 事件绑定指令,用来辅助程序员为 DOM 元素绑定事件监听.语法格式如下: 注意:原生 DOM 对象有 onclick.oninput.onkeyup 等 ...

Vue -- watch用法

Vue -- watch用法相关推荐

最新文章

热门文章