VueJs $watch()方法总结!!

最近公司用vue框架写交互,之前没怎么写过,但是很多数据双向绑定的东东跟angular很像!所以上手很快!哈哈

今天就碰到一个vue的问题啊!!产品需求是,datetimepick时间选择器一更改时间,就重新ajax获取数据渲染图表,很简单的需求啊!用angula ng-change监听inpu框框,分分钟搞定啊!用特么js原生 on-change也分分钟搞定啊!问题是尼玛的VueJs对input框没有change事件!尼玛坑爹啊!(不知道是不是我没找到,反正api里没有,goole了半天,也没有,要是有的话,麻烦留言告诉我,谢谢!!)

翻了半天api最后换了$watch()方法,才搞定这个需求,我梳理了方法如下,$watch()监听某个值(双向绑定)的变化,一旦发生变化,就调用引号里的方法,从而达到change事件监听的效果!!

[javascript] view plain copy
 
  1. var v_assetManage_controller = new Vue({  
  2.     el: '.LSee-index',  
  3.     data: {  
  4.         trendQueryTimeCtr: {  
  5.             startTime: '',  
  6.             endTime: ''  
  7.         }  
  8.     },  
  9.     ready: function() {  
  10.         //  
  11.     },  
  12.     methods: {  
  13.         queryTrendData: function(){  
  14.             //do some here  
  15.         }  
  16.     },  
  17.     watch: {  
  18.         'trendQueryTimeCtr.startTime': 'queryTrendData',  
  19.         'trendQueryTimeCtr.endTime': 'queryTrendData'  
  20.     }  
  21.   
  22. });  
原文地址:https://www.cnblogs.com/qiao20/p/7285193.html