zoukankan      html  css  js  c++  java
  • vue中watch的用法

    一、首先确认watch是一个对象,一定要当做对象来用

    watch:{
    
    }
    

      对象:有键,有值。

     1、键:就是你要监控的那个家伙,比如说$route,这个就是要监控路由的变化。或者是data中的某个变量。

     2、值:

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

      ② 可以是【函数名】:不过这个函数名要用单引号来包裹。

      ③ 可以是【包括选项的对象】:选项包含有三个,如下:

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

        b. 第二个是deep:其值是true或false;确认是否深入监听。(一般监听时是不能监听到对象属性值的变化的,数组的值变化可以监听到,因此:数据的改变不需要使用深度watch

        c. 第三个是immediate:其值是true或false,确认是否以当前的初始值执行handler的函数

    var vm = new Vue({
        data:{
            a:1,
            b:2,
            c:3
        },
        watch:{
            //值:函数
            a:function(val, oldVal) {
                console.log('new: %s, old: %s', val, oldVal)
            },
            //值:方法名
            b:'someMethod',
            //选项的对象
            c:{
                handler:function(val, oldVal){
                    console.log(val, oldVal)
                },
                deep: true,
                immediate: true
            }
        }
    });
    

      参考地址:https://blog.csdn.net/wangxiaoxiaosen/article/details/78487089

           https://blog.csdn.net/itkingone/article/details/69568498

           https://blog.csdn.net/zhuming3834/article/details/79726929

            

  • 相关阅读:
    RabbitMQ(四)
    RabbitMQ(三)
    RabbitMQ(二)
    定位
    响应式布局
    学习前端的一些心得
    css样式大全
    常用标签
    HTML
    app 被拒绝原因
  • 原文地址:https://www.cnblogs.com/carriezhao/p/9330137.html
Copyright © 2011-2022 走看看