vue watch深度监听对象,实现数据联动

当对象内的某一个元素发生变化,判断对象另一元素,并进行赋值
<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深度监听对象,实现数据联动的更多相关文章
- vue watch 深度监听以及立即监听
vue watch对象可以监听数据,数据发生变化,处理函数 watch虽可以监听,但只是浅监听,只监听数据第一层或者第二层.比如对于整个对象的监听,需要用到深度监听 vm.$watch('obj',f ...
- vue watch 深度监听
watch 是vue 里非常有用的回调函数,监听数据变化,非常方便好用,但是,当监听的数据是个复杂型的数据里,里面的数据变化时普通的监听方式是监听不到的,必须使用深度监听: data() { retu ...
- Vue之watch监听对象中某个属性的方法
新建 userinfo = { name: "小明", age: "18", } vue中watch监听name的方法 1. 可以结合计算属性的方法实现 { ...
- Proxy监听对象的数据变化,处理绑定数据很有用
Proxy可以监听对象身上发生了什么事情,并在这些事情发生后执行一些相应的操作.一下子让我们对一个对象有了很强的追踪能力,同时在数据绑定方面也很有用处. }; //interceptor 拦截 var ...
- vue中实时监听对象或变量的变化
demo中监听了Input的变化,主要用到的是watch 1. 监听单个对象: <template> <div class="personal-center"&g ...
- vue 侦听器watch 之 深度监听 deep
<template> <div> <p>FullName: {{person.fullname}}</p> <p>FirstName: &l ...
- vue 监听对象里的特定数据
vue 监听对象里的特定数据变化 通常是这样写的,只能监听某一个特定数据 watch: { params: function(val) { console.log(val) this.$ajax.g ...
- vue中的computed(计算属性)和watch(监听属性)的特点,以及深度监听
//计算属性是根据data中已有的属性,计算得到一个新的属性, <div>全名:{{fullName}}</div> 创建计算属性通过computed关键字,它是一个对象 计算 ...
- vue中如何深度监听一个对象?
大家都知道,Vue项目中对数据的监听,提供了一个很好的钩子watch,watch可以极其方便的监听我们常用数据类型值的变化,但通常当我们想监听一个对象中,某个属性值的变化时,很难达到我们预期的效果.那 ...
随机推荐
- Webpack热加载和React(其中有关于include和exclude的路径问题)
看了几个React配合webpack的教程,大部分都因为版本问题过时了.终于找到了一个不错的教程.记录下其中的知识点. 首先万分感谢这个教程的制作者.少走了许多弯路,正在学习webpack的小伙伴可以 ...
- JavaScript刷新页面,不重复提交
location.replace(location.href);//刷新页面,不重复提交
- eclipse ctrl+h
之前我的eclipse使用ctrl + h 出现的总是Plug-in Search ,总是需要点那个小三角才能找到File Search ,深感使用不便, 修改方法:Window->Genera ...
- 在Pycharm中写python代码时光标变粗
在练习写python代码时,不小心摁了Insert键,结果光标变粗. 如下图所示: 原因: 和word一样,在编辑文本或代码时,有两种模式:改写和插入模式. 当我们在编辑文章或者是代码时,应该将模式设 ...
- datagrid 里面的formatter方法
A.{field:'station_staus',title:'工位状态',width:250,align:'center',formatter: function(value,row,index){ ...
- 最简实例演示asp.net5中用户认证和授权(1)
asp.net5中,关于用户的认证和授权提供了非常丰富的功能,如果结合ef7的话,可以自动生成相关的数据库表,调用也很方便. 但是,要理解这么一大堆关于认证授权的类,或者想按照自己项目的特定要求对认证 ...
- Unity C# 脚本的单例
今天学习了一个比较不错的单例模式 public class UnitySigleton <T>: MonoBehaviour where T:class { public static T ...
- js小数点后保留几位方法:toFixed
(0.22223343534).toFixed(2) 结果:0.22
- Android入门:Service入门介绍
一.Service介绍 Service类似于Windows中的服务,没有界面,只是在后台运行:而服务不能自己运行,而是需要调用Context.startService(Intent intent);或 ...
- Backbone源码风格
代码风格: 一.自执行匿名函数创建执行环境 var root = this; root保存全局执行环境的指针.浏览器端为window对象 二.依赖库 (1).underscore 如果bac ...