当对象内的某一个元素发生变化,判断对象另一元素,并进行赋值

 <template>

   <input type="text" v-model="a.a1.a12"/>{{a.a1.a12}}

   <input type="text" v-model="a.a2.a22"/>{{a.a2.a22}}

 </template>

 <script>

   data(){

     retrun{

       a:{

         a1:{

           a12:12

         },

         a2:{

           a22:15

         }

       }

   },

   watch:{

     a:{

       handler(val.oldval){

         if(val.a1.a12<val.a2.a22){

           val.a2.a22=val.a1.a12;

         }

       },

       deep:true

     }

   }

 </script>

vue watch深度监听对象,实现数据联动的更多相关文章

  1. vue watch 深度监听以及立即监听

    vue watch对象可以监听数据,数据发生变化,处理函数 watch虽可以监听,但只是浅监听,只监听数据第一层或者第二层.比如对于整个对象的监听,需要用到深度监听 vm.$watch('obj',f ...

  2. vue watch 深度监听

    watch 是vue 里非常有用的回调函数,监听数据变化,非常方便好用,但是,当监听的数据是个复杂型的数据里,里面的数据变化时普通的监听方式是监听不到的,必须使用深度监听: data() { retu ...

  3. Vue之watch监听对象中某个属性的方法

    新建 userinfo = { name: "小明",  age: "18", } vue中watch监听name的方法 1. 可以结合计算属性的方法实现 { ...

  4. Proxy监听对象的数据变化,处理绑定数据很有用

    Proxy可以监听对象身上发生了什么事情,并在这些事情发生后执行一些相应的操作.一下子让我们对一个对象有了很强的追踪能力,同时在数据绑定方面也很有用处. }; //interceptor 拦截 var ...

  5. vue中实时监听对象或变量的变化

    demo中监听了Input的变化,主要用到的是watch 1. 监听单个对象: <template> <div class="personal-center"&g ...

  6. vue 侦听器watch 之 深度监听 deep

    <template> <div> <p>FullName: {{person.fullname}}</p> <p>FirstName: &l ...

  7. vue 监听对象里的特定数据

    vue  监听对象里的特定数据变化 通常是这样写的,只能监听某一个特定数据 watch: { params: function(val) { console.log(val) this.$ajax.g ...

  8. vue中的computed(计算属性)和watch(监听属性)的特点,以及深度监听

    //计算属性是根据data中已有的属性,计算得到一个新的属性, <div>全名:{{fullName}}</div> 创建计算属性通过computed关键字,它是一个对象 计算 ...

  9. vue中如何深度监听一个对象?

    大家都知道,Vue项目中对数据的监听,提供了一个很好的钩子watch,watch可以极其方便的监听我们常用数据类型值的变化,但通常当我们想监听一个对象中,某个属性值的变化时,很难达到我们预期的效果.那 ...

随机推荐

  1. MySQL库改名、表改名

    数据库中的库或表在开发环境下可能需要改名,关于MySQL的改名步骤如下: 1.备份数据库,备份后就可以安心的去改名了,如果操作错误还可以及时恢复 mysqldump -R -uroot -p 数据库名 ...

  2. springMvc json 参数

    以前,一直以为在SpringMVC环境中,@RequestBody接收的是一个Json对象,一直在调试代码都没有成功,后来发现,其实 @RequestBody接收的是一个Json对象的字符串,而不是一 ...

  3. [Leetcode]011. Container With Most Water

    public class Solution { public int maxArea(int[] height) { int left = 0, right = height.length - 1; ...

  4. bootstrap multiselect的使用 多选下拉菜单

    官网网址: http://davidstutz.de/bootstrap-multiselect/

  5. Excel2010表格里设置每页打印时都有表头

    在打印Excel表格时常常会出现如果存在多页打印时,往往从第二页开始就会出现没有表头的情况,导致到后面都不清楚对应的是哪个数据,查看时也很麻烦,下面就将为大家介绍如何在Excel表格里设置每页打印时都 ...

  6. jquery——尺寸

    1. 获取和设置元素的尺寸 2. 获取元素相对页面的绝对位置:offset() 这种方式增加的盒子不会对之前的结构产生影响 demo: <!DOCTYPE html> <html l ...

  7. Json 解析Json

    1.把LitJson导入到项目里面; 2.建一个下面的脚本,不挂在游戏对象上; 3.新建下面一个脚本,挂在相机上. using System.Collections; using System.Col ...

  8. Java文件与io——字节数组流数据流字符串流

    字节数组流 ByteArrayInputStream:包含一个内部缓冲区,该缓冲区包含从流中读取的字节.内部计数器跟踪read方法要提供的下一个字节.关闭ByteArrayInputStream无效. ...

  9. [知乎作答]·关于在Keras中多标签分类器训练准确率问题

    [知乎作答]·关于在Keras中多标签分类器训练准确率问题 本文来自知乎问题 关于在CNN中文本预测sigmoid分类器训练准确率的问题?中笔者的作答,来作为Keras中多标签分类器的使用解析教程. ...

  10. 上机练习2 生成计算机ID

    using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...