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


Posted in Javascript onAugust 16, 2018

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深度监听对象实现数据联动效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
基于jquery+thickbox仿校内登录注册框
Jun 07 Javascript
简略的前端架构心得&amp;&amp;基于editor为例子的编码小技巧
Nov 25 Javascript
javascript中数组array及string的方法总结
Nov 28 Javascript
jQuery获取及设置表单input各种类型值的方法小结
May 24 Javascript
JavaScript实现的select点菜功能示例
Jan 16 Javascript
深入理解Angular.JS中的Scope继承
Jun 04 Javascript
AngularJS实现自定义指令与控制器数据交互的方法示例
Jun 19 Javascript
Swiper实现轮播图效果
Jul 03 Javascript
vue引入jq插件的实例讲解
Sep 12 Javascript
微信小程序实现天气预报功能
Jul 18 Javascript
vue自定义键盘信息、监听数据变化的方法示例【基于vm.$watch】
Mar 16 Javascript
layui实现三级联动效果
Jul 26 Javascript
JS实现的RC4加密算法示例
Aug 16 #Javascript
vue2.0父子组件间传递数据的方法
Aug 16 #Javascript
Vue2.0中三种常用传值方式(父传子、子传父、非父子组件传值)
Aug 16 #Javascript
bootstrap实现点击删除按钮弹出确认框的实例代码
Aug 16 #Javascript
浅谈Vue.js路由管理器 Vue Router
Aug 16 #Javascript
layui问题之模拟select点击事件的实例讲解
Aug 15 #Javascript
深入理解Vue router的部分高级用法
Aug 15 #Javascript
You might like
PHP 5.3.1 安装包 VC9 VC6不同版本的区别是什么
2010/07/04 PHP
Laravel框架源码解析之反射的使用详解
2020/05/14 PHP
event对象的方法 兼容多浏览器
2009/06/27 Javascript
火狐4、谷歌12不支持Jquery Validator的解决方法分享
2011/06/20 Javascript
js中的string.format函数代码
2020/08/11 Javascript
分享8款优秀的 jQuery 加载动画和进度条插件
2012/10/24 Javascript
兼容IE和Firefox火狐的上下、左右循环无间断滚动JS代码
2013/04/19 Javascript
js判断iframe内的网页是否滚动到底部触发事件
2014/03/18 Javascript
js中回调函数的学习笔记
2014/07/31 Javascript
5个JavaScript经典面试题
2014/10/13 Javascript
javascript获取当前的时间戳的方法汇总
2015/07/26 Javascript
JS实现的3D拖拽翻页效果代码
2015/10/31 Javascript
jQuery validate+artdialog+jquery form实现弹出表单思路详解
2016/04/18 Javascript
自制微信公众号一键排版工具
2016/09/22 Javascript
angular基于路由控制ui-router实现系统权限控制
2016/09/27 Javascript
关于Vue.js一些问题和思考学习笔记(2)
2016/12/02 Javascript
node学习记录之搭建web服务器教程
2017/02/16 Javascript
JS查找数组中重复元素的方法详解
2017/06/14 Javascript
详解vue-cli项目中的proxyTable跨域问题小结
2018/02/09 Javascript
详解JS中统计函数执行次数与执行时间
2018/09/04 Javascript
对于Python深浅拷贝的理解
2019/07/29 Python
opencv-python 提取sift特征并匹配的实例
2019/12/09 Python
python可迭代对象去重实例
2020/05/15 Python
通过Python实现一个简单的html页面
2020/05/16 Python
python openCV实现摄像头获取人脸图片
2020/08/20 Python
python爬虫beautifulsoup库使用操作教程全解(python爬虫基础入门)
2021/02/19 Python
应用数学自荐书范文
2013/11/24 职场文书
历史专业个人求职信范文
2013/12/07 职场文书
期末自我鉴定
2014/01/23 职场文书
如何写股份合作协议书
2014/09/11 职场文书
放射科岗位职责
2015/02/14 职场文书
任长霞观后感
2015/06/16 职场文书
python使用tkinter实现透明窗体上绘制随机出现的小球(实例代码)
2021/05/17 Python
pytorch中的model=model.to(device)使用说明
2021/05/24 Python
MongoDB安装使用并实现Python操作数据库
2021/06/28 MongoDB
新手初学Java网络编程
2021/07/07 Java/Android