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 相关文章推荐
原生js 秒表实现代码
Jul 24 Javascript
JavaScript高级程序设计 阅读笔记(十八) js跨平台的事件
Aug 14 Javascript
jQuery中获取checkbox选中项等操作及注意事项
Nov 24 Javascript
JavaScript调用ajax获取文本文件内容实现代码
Mar 28 Javascript
了解Javascript的模块化开发
Mar 02 Javascript
jQuery链式操作实例分析
Nov 16 Javascript
Node.js中process模块常用的属性和方法
Dec 13 Javascript
微信小程序 设置启动页面的两种方法
Mar 09 Javascript
javascript中this用法实例详解
Apr 06 Javascript
JS实现的A*寻路算法详解
Dec 14 Javascript
如何实现双向绑定mvvm的原理实现
May 28 Javascript
Vue实现表格批量审核功能实例代码
May 28 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及Zend Engine的线程安全模型分析
2011/11/10 PHP
PHP实现变色验证码实例
2014/01/06 PHP
qq登录,新浪微博登录接口申请过程中遇到的问题
2014/07/22 PHP
php实现专业获取网站SEO信息类实例
2015/04/02 PHP
Docker搭建自己的PHP开发环境
2018/02/24 PHP
Dojo 学习笔记入门篇 First Dojo Example
2009/11/15 Javascript
使用Mootools动态添加Css样式表代码,兼容各浏览器
2011/12/12 Javascript
JavaScript cookie的设置获取删除详解
2014/02/11 Javascript
使用requestAnimationFrame实现js动画性能好
2015/08/06 Javascript
关于获取DIV内部内容报错的原因分析及解决办法
2016/01/29 Javascript
jQuery Ajax 上传文件处理方式介绍(推荐)
2016/06/30 Javascript
Bootstrap字体图标无法正常显示的解决方法
2016/10/08 Javascript
微信小程序 循环及嵌套循环的使用总结
2017/09/26 Javascript
NodeJs通过async/await处理异步的方法
2017/10/09 NodeJs
Js视频播放器插件Video.js使用方法详解
2020/02/04 Javascript
python更新列表的方法
2015/07/28 Python
python模拟事件触发机制详解
2018/01/19 Python
pandas中的DataFrame按指定顺序输出所有列的方法
2018/04/10 Python
使用python读取csv文件快速插入数据库的实例
2018/06/21 Python
Python将多个list合并为1个list的方法
2018/06/27 Python
Tensorflow中的placeholder和feed_dict的使用
2018/07/09 Python
python实时获取外部程序输出结果的方法
2019/01/12 Python
python绘制漏斗图步骤详解
2019/03/04 Python
python3.6根据m3u8下载mp4视频
2019/06/17 Python
简单了解python反射机制的一些知识
2019/07/13 Python
python boto和boto3操作bucket的示例
2020/10/30 Python
会计电算化专业毕业生推荐信
2013/12/24 职场文书
高等教育学自荐书范文
2014/02/10 职场文书
明信片寄语大全
2014/04/08 职场文书
合伙经营协议书
2014/04/18 职场文书
《生命 生命》教学反思
2014/04/19 职场文书
社团活动总结报告
2014/06/27 职场文书
会议开幕词
2015/01/28 职场文书
2015年会计年终工作总结
2015/05/26 职场文书
2016年社会管理综治宣传月活动总结
2016/03/16 职场文书
JavaScript继承的三种方法实例
2021/05/12 Javascript