watch是一个对象,具有键值对;键指被监听的数据,值指处理方式。

值类型包括以下三个:

  1. 第一个handler:其值是一个回调函数。即监听到变化时应该执行的函数。
  2. 第二个是deep:其值是true或false;确认是否深入监听。(一般监听时是不能监听到对象属性值的变化的,数组的值变化可以听到。)
  3. 第三个是immediate:其值是true或false;确认是否以当前的初始值执行handler的函数。
var vm = new Vue({
data: {
a: 1,
b: 2
},
watch: {
a: function (val, oldVal) {
console.log('new: %s, old: %s', val, oldVal)
},
// 方法名
b: 'someMethod',
// 选项的对象
c: {
handler: function (val, oldVal) { /* ... */ },
deep: true,
immediate: true
}
}
})

原文:https://blog.csdn.net/wangxiaoxiaosen/article/details/78487089

vue中watch简单使用的更多相关文章

  1. axios在Vue中的简单应用(一)

    1.安装axios: npm install --save axios vue-axios 2.安装qs: qs.stringify(data)可以解决data数据格式问题 npm install - ...

  2. axios在vue中的简单配置与使用

    一.axios 简介 axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征:https://hzzly.github.io/2017/03/12/ ...

  3. vue中超简单的方法实现点击一个按钮出现弹框,点击弹框外关闭弹框

    效果图展示: View层 <template> <div> <div class="mask" v-if="showModal" ...

  4. vue中简单的小插曲

    我们现在来学习一下vue中一些简单的小东西: 首先我们必须要引入vue.js文件哦! 1.有关文本框里的checkbox js代码: new Vue({ el:"#app", da ...

  5. 微信 jssdk 逻辑在 vue 中的运用

    微信 jssdk 在 vue 中的简单使用 import wx from 'weixin-js-sdk'; wx.config({ debug: true, appId: '', timestamp: ...

  6. 【转】简单理解Vue中的nextTick

    前言: Vue中的nextTick涉及到Vue中DOM的异步更新,感觉很有意思,特意了解了一下.其中关于nextTick的源码涉及到不少知识,很多不太理解,暂且根据自己的一些感悟介绍下nextTick ...

  7. 简单理解Vue中的nextTick

    Vue中的nextTick涉及到Vue中DOM的异步更新,感觉很有意思,特意了解了一下.其中关于nextTick的源码涉及到不少知识,很多不太理解,暂且根据自己的一些感悟介绍下nextTick. 一. ...

  8. vue中引入mintui、vux重构简单的APP项目

    最近在学习vue时也了解到一些常用的UI组件,有用于PC的和用于移动端的.用于PC的有:Element(饿了么).iView等:用于移动端APP的有Vux.Mint UI(饿了么).Vant(有赞团队 ...

  9. vue中axios的简单使用

    我们一般在用jq的时候会使用到ajax来进行与服务器之间的交流,vue中也提供了相应的类似于ajax的方法-axios来进行与服务器之间的数据传递 现在的这篇是最简单的使用,后续会添加上来复杂的使用 ...

随机推荐

  1. jQuery 实现表格变色效果

    html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...

  2. OpenLayers API整理

    整理的Openlayers 的知识笔记,随着运用不断加深理解,也会不断更新. 本文链接:Openlayers API整理 作者:狐狸家的鱼 GitHub:八至 一.创建地图 1.地图Map 创建地图底 ...

  3. C语言——杂实例

    #include <stdio.h> #include <stdlib.h> #include <string.h> void f (int **p); void ...

  4. shell 以指定字符拆分字符串

    string="hell|ttt|sss|2222" OLD_IFS="$IFS" IFS="|" array=($string) IFS= ...

  5. JindoFS解析 - 云上大数据高性能数据湖存储方案

    JindoFS背景 计算存储分离是云计算的一种发展趋势,传统的计算存储相互融合的的架构存在一定的问题, 比如在集群扩容的时候存在计算能力和存储能力相互不匹配的问题,用户在某些情况下只需要扩容计算能力或 ...

  6. PHP curl_pause函数

    curl_pause — 暂停及恢复连接. 说明 int curl_pause ( resource $ch , int $bitmask ) 参数 ch 由 curl_init() 返回的 cURL ...

  7. 【dart学习】-- Dart之JSON

    概述 现在很难想象移动应用程序不需要与后台交互或者存储结构化数据.现在开发,数据传输方式基本都是用JSON,在Flutter中是没有GSON/Jackson/Moshi这些库,因为这些库需要运行时反射 ...

  8. jdbc blob插入及查询操作

    首先建一张表 create table picture( picId ) primary key not null, picName ) not null, picfile image null ) ...

  9. jquery实现回车键登录/搜索等确认功能

    button按钮提交方式: $('#search').click(function() { get_table(); }); //keyCode=13是回车键,设置回车键提交 $("body ...

  10. CDN技术之--流媒体CDN系统的组成

    流媒体业务是一种对实时性.连续性.时序性要求非常高的业务,无论从带宽消耗上还是质量保障上来说,对best-effort的IP网络都是一个不小的冲击 –高带宽要求–高QoS要求–组播.广播要求(目前IP ...